CODEWITHSUNDEEP
javascriptjquery
rob
rob

Reputation: 149

unable to return result using jquery

I'm using jquery UI's slider and i want to return the results from multiple sliders so I can performs a calculation.

this is what i have so far but I'm struggling to get any results from out side the function.

$(function() {
  var x
  $("#slider4").slider({
      value: 1,
      min: 0,
      max: 50,
      step: 5,
      slide: function(event, ui) {
          $("#items").val("$" + ui.value);
          x =$("#items").val("$" + ui.value);
      }

  });
  $("#items").val("$" + $("#slider4").slider("value"));
  console.log(x) // this doesnt update the console with the slider value
 });

Ideally outside the function i would want to add multiple slider results similar to below.

var z = x * y;

Upvotes: 0

Views: 58

Answers (2)

epascarello
epascarello

Reputation: 207511

The value does not magically keep updating the textbox, you need to write code that updates the value when the slider value changes. So add a change event

change: function( event, ui ) { $("#items").val(ui.value); }

Upvotes: 0

Rory McCrossan
Rory McCrossan

Reputation: 337560

To get the value of the slider outside of the slide handler you can either retrieve the value of #items (as you update that within the slide handler):

var sliderValue = $('#items').val();

Or you can read the value from the slider() directly:

var sliderValue = $('#slier4').slider('option', 'value');

Also, note that you do not need to append empty strings when setting val():

$("#slider4").slider({
    value: 1,
    min: 0,
    max: 50,
    step: 5,
    slide: function(event, ui) {
        $("#items").val(ui.value);
    }
});

Upvotes: 1

Related Questions