2016-05-23 34 views
2

嘿我已經檢查了關於重置noUiSlider的主題,但我找不到處理我的方法。有什麼建議麼 ?不能重置noUiSlider

<div class="row"> 
<div class="small-6 columns"> 
<button type="reset" class="w2-button w2-button-black button-reset">reset</button> 
</div> 
<div class="small-6 columns"> 
<button type="submit" class="w2-button w2-button-black">Update</button> 
</div> 
</div> 

noUiSlider.create($('#productspage-price-slider')[0], { 
      start: [productsModel.priceFrom, productsModel.priceTo], 
      connect: true, 
      range: { 
       min: productsModel.minPrice, 
       max: productsModel.maxPrice 
      }, 
      format: { 
       from: function (value) { 
        return Math.round(value); 
       }, 
       to: function (value) { 
        return Math.round(value); 
       } 
      }, 
      tooltips: true 
     }); 

回答

0

嗯,首先將滑塊實例保存到一個變量,像這樣:

var slider = noUiSlider.create($('#productspage-price-slider')[0], { 

然後創建復位按鈕的事件處理程序,並set的inital值

$("button[type=reset]").on("click", function(){ 
    slider.set([productsModel.priceFrom, productsModel.priceTo]); 
}); 

在這裏看到一個工作示例:FIDDLE

+0

謝謝你,非常好:)! – divisionkiller