Параметр jquery-ui-slider min max и значение

Question

У меня есть jquery-ui-слайдер, который преобразует все входы с особым классом в слайдер.

// Create Jquery-ui Slider 
$(".create_slider").after('<div class="slider"></div>'); 
// 
$(".slider").slider({ 
    value: $(this).siblings("input").val(), 
    min: $(this).siblings("input").data("min"), 
    max: $(this).siblings("input").data("max"), 
    slide: function (event, ui) { 
     $(this).siblings("input").val(ui.value); 
    } 
}); 

Html является:

<td> 
    <input type="text" value="11" id="jpeg_compression" name="jpeg_compression" data-min="0" data-max="100" class="regular-text create_slider" readonly=""> 
    <div class="slider"></div> 
    <p class="description"></p> 
</td> 

Но стоимость мин-макс не работает. $(this).siblings("input").data("min") не работает!

Я понимаю, почему это не работает, но какие решения?

Я установил задачи с помощью создания:

      // 
          // 
          // Create Jquery-ui Slider 
          $(".create_slider").after('<div class="slider"></div>'); 
          // 
          $(".slider").slider({ 
           min: $(this).siblings("input").data("min"), 
           max: $(this).siblings("input").data("max"), 
           slide: function(event, ui) { 
           $(this).siblings("input").val(ui.value); 
           }, 
           create: function(event, ui){ 
           $(this).slider('value',$(this).siblings("input").val()); 
           } 
          }); 

Answer 1

Начиная с вашего почти рабочим раствора можно использовать create функции для другого Params тоже.

Вы можете установить min и max в качестве опции с http://api.jqueryui.com/slider/#option-max

Код:

// Create Jquery-ui Slider 
$(".create_slider").after('<div class="slider"></div>'); 
// 
$(".slider").slider({ 
    slide: function (event, ui) { 
     $(this).siblings("input").val(ui.value); 
    }, 
    create: function (event, ui) { 
     $(this).slider("option", "min", $(this).siblings("input").data("min")); 
     $(this).slider("option", "max", $(this).siblings("input").data("max")); 
     $(this).slider('value', $(this).siblings("input").val()); 
    } 
}); 

Демо: http://jsfiddle.net/IrvinDominin/HZqA7/

Answer 2

В min и max параметры имеют номера, но ваши data- атрибуты возвращаются в виде строк.

Вы должны преобразовать их значение, с parseInt(), например:

$(".create_slider").after('<div class="slider"></div>'); 
var $siblings = $(this).siblings("input"); 
$(".slider").slider({ 
    value: $siblings.val(), 
    min: parseInt($siblings.data("min"), 10), 
    max: parseInt($siblings.data("max"), 10), 
    slide: function(event, ui) { 
     $siblings.val(ui.value); 
    } 
});