i have a problem with jquery slider value after changing it. I'm just using normal jquery UI (version 1.10.4) and jquery core 1.7.2

First time after refresh i have a value which i want. But after the change i can't get it. And i need that to have a if statemnet which will change a value of the paragraph.

This is a JQuery code:

$(function() {
  $( "#slider" ).slider({
  range:"min",
  min: 0,
  max: 100,
  value: 10,
  slide: function wynik( event, ui ) {
     $( "#price" ).val("$" + ui.value);
  }
  });
  $( "#price" ).val( "$" + $( "#slider" ).slider( "value") );
    var val = $('#slider').slider("value");
    if ( val >= 20 ) {
       $("#priceText").text("first text");
    } else {
       $("#priceText").text("second text");
    }
});

What is wrong here?

I want to change a text in label:

<p>
<input type="text" id="price">
<label id="priceText" for="price">Some text to change</label>
</p>

Input working correctly and show the value all the time in right way. But label doesn't change (only first time after refresh).

I have read a lot of posts on SO before i post this one. For example: How to get value from jQuery UI slider? or How to get value from input with dynamically changed value by jquery UI slider? But i can't get it done anyway.

i have a problem with jquery slider value after changing it. I'm just using normal jquery UI (version 1.10.4) and jquery core 1.7.2

First time after refresh i have a value which i want. But after the change i can't get it. And i need that to have a if statemnet which will change a value of the paragraph.

This is a JQuery code:

$(function() {
  $( "#slider" ).slider({
  range:"min",
  min: 0,
  max: 100,
  value: 10,
  slide: function wynik( event, ui ) {
     $( "#price" ).val("$" + ui.value);
  }
  });
  $( "#price" ).val( "$" + $( "#slider" ).slider( "value") );
    var val = $('#slider').slider("value");
    if ( val >= 20 ) {
       $("#priceText").text("first text");
    } else {
       $("#priceText").text("second text");
    }
});

What is wrong here?

I want to change a text in label:

<p>
<input type="text" id="price">
<label id="priceText" for="price">Some text to change</label>
</p>

Input working correctly and show the value all the time in right way. But label doesn't change (only first time after refresh).

I have read a lot of posts on SO before i post this one. For example: How to get value from jQuery UI slider? or How to get value from input with dynamically changed value by jquery UI slider? But i can't get it done anyway.

• javascript
• jquery
• html
• jquery-ui

2 Answers 2

You can try this:

$("#selector").change(function() {
    $("#slider-range").slider('values',0,$(this).val());
});

Working Fiddle

Jquery Slider emit a "slidechange" event everytime it change value

Remember, it should be listened on the jQuery element after you've registered the event in the element itself

$( "#slider" ).slider({
    change: function( event, ui ) {
        // register event here
    }
});

$( "#slider" ).on( "slidechange", function( event, ui ) {
    // use ui.value to get the current value
} );

Check the official api wiki for all the slider related events

Official Slider Api