nasıl dinamik olarak jquery ui kaydırıcı için min, maks değerleri değiştirebilirim?

Question

yüzden aşağıdaki ile başlatıldı üzerinde bir jquery ui kaydırıcı ile bir sayfa var:

var min = $("#attrInformation").data("lowest_price"), 
max = $("#attrInformation").data("highest_price"); 

    $("#slider-range").slider({ 
     range: true, 
     min: min, 
     max: max, 
     values: [ min, max ], 
     slide: function(event, ui) { 
      var start = ui.values[0], 
      end = ui.values[1]; 

      $("#startPrice").text(start); 
      $("#endPrice").text(end); 
     }, 
     stop: function(event,ui){ 
      var start = ui.values[0], 
      end = ui.values[1]; 

      refineObject.price_min = start; 
      refineObject.price_max = end; 

      refineResults(refineObject); 
     } 
    }); 

ve ben iki kolları dayansın üzerinde oldukları dak, max VE değerini değiştirmek mümkün olmak istiyorum ajax arama sonuçları. Böyle yüzden denedim şey:

benim minimum ve maksimum sınıfına start_price ve end_price ile iki gizli div içinde bulunan

$.get("ajax.php",options,function(data){ 
    $('.middle_container').html(data);   

    $('#slider-range').slider("option", "min", $('.middle_container').find('.start_price').val()); 
    $('#slider-range').slider("option", "max", $('.middle_container').find('.end_price').val()); 
    $('#slider-range').slider("value", $('#slider-range').slider("value")); 

     }); 

. Bu şu anda maksimum fiyat güncellemek etmez ve kaydırıcının sağ kolu konumunun dışına solda üzerinde görünür çalışmaz. Bu işin nasıl yapıldığına dair herhangi bir öneriniz var mı? Ben backend için php kullanıyorum. Başlangıç_fiyatı ve end_price kodu çalışma ve doğru olduğunu.

Answer 1

$('.middle_container').find('.start_price').val() ve $('.middle_container').find('.end_price').val() uygun değerleri dönen emin olun. Ayrıca size min/maks değerleri ayarlamak için kullandığınız aynı sözdizimini kullanmak zorunda kaydırıcı değerini ayarlamak için. Ayrıca

bu

$.get("ajax.php",options,function(data){ 
    $('.middle_container').html(data);   

    $('#slider-range').slider("option", "min", $('.middle_container').find('.start_price').val()); 
    $('#slider-range').slider("option", "max", $('.middle_container').find('.end_price').val()); 
    $('#slider-range').slider("option", "value", $('#slider-range').slider("value")); 

}); 

Answer 2

tamamen kaydırıcı işlevini kaldıran ilk kaydırıcı, Destroy deneyin. Bu, öğeyi öntanımlı durumuna geri döndürür.

$("#selector").slider("destroy"); 

Bundan sonra, sıra kaydırıcı Bu işleri

$("#selector").slider({ 
    range: "max", 
    min: 0, // min value 
    max: 200, // max value 
    step: 0.1, 
    value: 200, // default value of slider 
    slide: function(event, ui) { 
     $("#amount").val(ui.value); 
    } 
});​ 

yeni değerler ekleyebilirsiniz.

Answer 3

Bunu bir giriş değerinde değiştirmek isterseniz, bunun gibi bir şey yapabilirsiniz.

$('#inputid').focusout(function() { 

    // slider destroy and create as Shailesh showed 
}); 

yerine odak keyUp kullanacaktım ama yapmak iç kontrollerine bağlı olarak, kendi kaydırıcıyı etmeyeceksin geçmeden kadar kullanmak gibi bir faydası olmaz defalarca yeniden inşa bitebileceğini girişten.