2012-01-19 15 views
1

私は自分のページにJquery UIスライダを実装しています。スライダバーの値は、SQLデータソースにパラメータとして渡されます。ボタンをクリックすると、パラメータがデータソースに入力され、画面上のグリッドビューが再バインドされます。問題は、スクロールバーの位置を維持して、ユーザーが現在表示しているグリッドビューのパラメータとしてどの値が入力されたのかを知ることです。ここでjquery UIスライダをポストバック時のスクロール位置を維持する方法

は、スクロールバーの私のコードです:

<!--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」ですが、私は私がそれを変更するために必要なものはよく分かりません。助言がありますか?

答えて

2

ページに非表示フィールドを追加することができます。 submitの前にformpostbackに設定すると、この非表示フィールドは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")); 
});  
+0

この提案はありがとうございます。私は間違いなく正しい方法だと思っていますが、それでもなお1つの問題があります。私は私の隠しフィールド#sliderValeとして入力を使用し、ポストバックでも更新されるようですので、nullに戻り、スライダの値は100にデフォルト設定されます。 – TBK

+0

nm私はhiddenフィールドのプロパティを使用していませんでした。あなたの助けを借りてこのことに非常に感謝します – TBK

関連する問題