如何使jQuery UI滑塊在回發上保持滾動位置

Question

所以我在我的頁面上實現了一個Jquery UI滑塊。滑動條的值作爲參數提供給sql數據源。在點擊一個按鈕時，參數被輸入到數據源中，屏幕上的網格視圖重新綁定。問題是，我希望滾動條保持其位置，以便用戶知道什麼值作爲它們當前正在查看的gridview的參數輸入。

這裏是我的滾動條代碼：

<!--Slider bar for investment--> 

<div style="float:right;"> 
<script type = "text/javascript"> 

    $(function() { 
     $("#slider").slider({ 
      value: 100, 
      min: 1, 
      max: 200, 
      step: 1, 
      slide: function (event, ui) {      
       $("#hiddenInvestment").val(ui.value); 
      } 
     }); 
     $("#hiddenInvestment").val($("#slider").slider("value")); 
    });   
    </script> 

<div class="demo"> 
<p> 
<asp:label runat="server" id="amountlabel" >Investment:  
</asp:label>  
<input name="hiddenInvestment" id="hiddenInvestment" /> 
<asp:Label runat="server" ID="percentlabel">%</asp:Label> 
</p> 
<div id="Div1"></div> 
</div> 
<div class="demo" style="width:100px;"> 
<div id="slider"></div> 
</div> 

，我想我需要改變的線是「價值：100」，但我不知道我需要改變它。有什麼建議麼？

Answer 1

您可以在頁面上有一個隱藏字段。之前submitform爲postback設置此隱藏字段值爲slider值。在初始化slider時，在頁面加載時，請從此hidden字段中讀取初始值。試試這個

$(function() { 
    $("#slider").slider({ 
     value: ($('#sliderVale').val() || 100), 
     min: 1, 
     max: 200, 
     step: 1, 
     slide: function (event, ui) {      
      $("#hiddenInvestment").val(ui.value); 
     } 
    }); 
    $("#hiddenInvestment").val($("#slider").slider("value")); 
}); 


$('form').submit(function(){ 
    $('#sliderVale').val($("#slider").slider("value")); 
});