2014-09-24 84 views
0

有可能我正在这样做,但是在这里。我在一个updatepanel之外有一个滑块,用于刷新该面板的内容。我将滑块值传递给隐藏字段,并使用.Net TextChanged事件刷新面板。从jQueryUI滑块刷新UpdatePanel当值不变时

所有的作品很好,直到我只是单击句柄而不滑动它,所以值是相同的,它仍然触发滑块“更改”事件,但因为隐藏字段中的值没有改变.Net TextChanged事件doesn没有火,所以面板的内容消失了。

如果在没有移动句柄的情况下有一种方法可以忽略点击,或者在代码隐藏中保持相同值传递给数据函数的某种方式,那将是一件好事。

任何想法理解

戴夫

代码(为清楚起见略缩短)

<script> 
    $(document).ready(function() { 
     $("#slider").slider({ 
      min: 1, 
      max: sizes.length - 1, 
      value: 2, 
      animate: true,    
      create: function (event,ui){ 
       $("#slider").find(".ui-slider-handle").text("8") 
      }, 
      slide: function (event, ui) { 
       var value = $("#slider").slider("option", "value"); 
       $("#slider").find(".ui-slider-handle").text(sizes[ui.value]); 
      }, 
      change: function (event, ui) { 
       var value = $("#slider").slider("option", "value");     
       $("#slider").find(".ui-slider-handle").text(sizes[ui.value]); 
       $("#<%= hid.ClientID %>").val(sizes[ui.value]); 
       var UpdatePanel1 = '<%=ajaxGrid.ClientID%>'; 
       __doPostBack(UpdatePanel1, ''); 
      }, 
      stop: function (event, ui) { 
      } 
     }); 
    }); 
</script> 

<div id="slider" style="width:400px;"></div> 
<asp:UpdatePanel runat="server" ID="ajaxGrid" UpdateMode="Conditional"> 
    <ContentTemplate> 
     <div id="productgrid" class="productgrid" runat="server"></div> 

    </ContentTemplate> 
</asp:UpdatePanel> 
<asp:HiddenField ID="hid" runat="server" OnValueChanged ="portionCount_TextChanged" /> 

代码后面

List<product> _products = new List<product>(); 

protected void Page_Load(object sender, EventArgs e) 
{   
    if (!IsPostBack) 
    { 
     loadJSArray(); 
     _products = product.getProductsByCatParentAndServings(61, 8); // default 
    } 

    drawGrid(); 
} 

protected void portionCount_TextChanged(object sender, EventArgs e) 
{ 
    _products = product.getProductsByCatParentAndServings(61, int.Parse(hid.Value)); 
    drawGrid(); 
} 

回答

0

事实证明,这是用于纸板程序员的情况下 - 一旦我发布它,我想出了一个解决方案。

我设置一个临时变量,并刚刚通过了最后一组值和周围相比,所以jQuery的位是现在这个样子:

var sliderWas=0; 
     $("#slider").slider({ 
      min: 1, 
      max: sizes.length - 1, 
      value: 2, 
      animate: true,    
      create: function (event,ui){ 
       $("#slider").find(".ui-slider-handle").text("8") 
      }, 
      slide: function (event, ui) { 
       var value = $("#slider").slider("option", "value"); 
       $("#slider").find(".ui-slider-handle").text(sizes[ui.value]); 
      }, 
      change: function (event, ui) {     
       var value = $("#slider").slider("option", "value");     
       $("#slider").find(".ui-slider-handle").text(sizes[ui.value]); 
       $("#<%= hid.ClientID %>").val(sizes[ui.value]); 
       if (ui.value != sliderWas) { 
        var UpdatePanel1 = '<%=ajaxGrid.ClientID%>'; 
        __doPostBack(UpdatePanel1, ''); 
       } 
       sliderWas = value; 
      }, 
      stop: function (event, ui) { 
      } 
     });