Jquery UI Dynamic Multiple Slider updated Slider value based on Input text

Jquery UI Dynamic Multiple Slider updated Slider value based on Input text

So far I can set slider value based on input text value need to confirm about how to change slider set value .

I used custom slider handler

  1. <div style="margin:0px" id ="bonusScore" Style="width:100px;">
  2. <div id="custom-handle" class="ui-slider-handle"></div>  
  3. <input type="text"  name="assesmentScore"  class="input-mini" /input>
Script :
  1. $(function(){
  2. var handle = $("#custom-handle");
  3. var bonusSlider=$("#bonusScore", $(this)).slider({
  4. range: "min",
  5.  value:50,
  6. step: 10,
  7. min:10,
  8. max:100,
  9. slide: function( event, ui ) {

  11.  $(this).find(".ui-slider-handle").html(ui.value);
  12. },
  13. $(this).parents("tr").find('input[name="assesmentScore"]').on("keyup", function (event) {
  14.  var textValue = $(this).parents("tr").find('input[name="assesmentScore"]').val();
  15. bonusSlider.slider("value",textValue);
  16. $(this).find('.ui-slider-handle').html(textValue); // here I can't set slider change value just slider moving can't see handle text value.
  17. });

  19. });

  21. });