码迷,mamicode.com
首页 > Web开发 > 详细

ASPxComboBox控件联动效果bug改进

时间:2014-05-04 10:31:59      阅读:352      评论:0      收藏:0      [点我收藏+]

标签:style   blog   class   code   java   ext   

原文:ASPxComboBox控件联动效果bug改进

  在应用第三方控件DevExpress控件的时候,大家应该对ASPxComboBox控件应该不是很陌生吧,尤其在做多级联动效果的时候,有着它独特的地方,通过前台控制可以实现异步刷新。但是在实际做项目中,我发现它存在一定的问题。

      比如,我们做四级联动效果,四级分别为案件类型、案件性质、性质分类、性质细类,选择案件类型时,触发案件性质数据加载;选择案件性质时,性质分类数据加载,依次类推……;当我们将四级数据都加载到控件中的时候,如果我们重新选择案件类型(第一级)时,此时你会发现,二级内容重新加载了,但是三级四级内容没有清空,也没有变化,应该说这是不符合条件的,针对这个问题,我设计了下面解决方案

      源代码:

   

bubuko.com,布布扣
<table border="1" cellpadding="0" cellspacing="0" style="width:100%">
   <tr>
      <td>
          <dx:ASPxComboBox runat="server" ID="CbxAJLX" ClientInstanceName="cbxAJLX" DropDownStyle="DropDownList" TextField="AJLX" ValueField="AJLX" Width="80px" OnCallback="CbxAJLX_Callback">
              <ClientSideEvents SelectedIndexChanged="function(s, e) { OnAJLXChanged(s); }" />
          </dx:ASPxComboBox>
      </td>
      <td>
          <dx:ASPxComboBox runat="server" ID="CbxAJXZ" ClientInstanceName="cbxAJXZ" DropDownStyle="DropDownList" TextField="AJXZ" ValueField="AJXZ" Width="80px" OnCallback="CbxAJXZ_Callback">
              <ClientSideEvents SelectedIndexChanged="function(s, e) { OnAJXZChanged(s); }" />
          </dx:ASPxComboBox>
      </td>
      <td>
          <dx:ASPxComboBox runat="server" ID="CbxXZFL" ClientInstanceName="cbxXZFL" DropDownStyle="DropDownList" TextField="XZFL" ValueField="XZFL" Width="80px" OnCallback="CbxXZFL_Callback">
              <ClientSideEvents SelectedIndexChanged="function(s, e) { OnXZFLChanged(s); }" />
          </dx:ASPxComboBox>
      </td>
      <td>
          <dx:ASPxComboBox runat="server" ID="CbxXZXL" ClientInstanceName="cbxXZXL" DropDownStyle="DropDownList" TextField="XZXL" ValueField="XZXL" Width="80px" OnCallback="CbxXZXL_Callback">
          </dx:ASPxComboBox>
      </td>
    </tr>
</table>
bubuko.com,布布扣

  我先解释一下该代码吧,OnCallback事件时用于自身更新数据的,主要时通过上一级事件SelectedIndexChanged触发,其主要内容为cbxAJXZ.PerformCallback(cbxAJLX.GetValue().toString())。

  针对不能清空问题,在下级数据更新之前,我设计了一个方法,用于清空下级后面的所有联动控件中的数据,代码如下

bubuko.com,布布扣
function OnAJLXChanged(cbxAJLX) {
     myAjlx("clear");
     cbxAJXZ.PerformCallback(cbxAJLX.GetValue().toString());
}
function myAjlx(cmd) {
      if (cmd == "clear") {
            cbxAJXZ.SetValue(null);
            cbxXZFL.SetValue(null);
            cbxXZXL.SetValue(null);
      }
}
bubuko.com,布布扣

  通过调用上面这段代码可以实现多级数据联动不足的地方,下面是整个脚本

bubuko.com,布布扣
function OnAJLXChanged(cbxAJLX) {
            myAjlx("clear");
            cbxAJXZ.PerformCallback(cbxAJLX.GetValue().toString());
        }
        function OnAJXZChanged(cbxAJXZ) {
            myAjxz("clear");
            cbxXZFL.PerformCallback(cbxAJXZ.GetValue().toString());
        }
        function OnXZFLChanged(cbxXZFL) {
            myXzfl("clear");
            cbxXZXL.PerformCallback(cbxXZFL.GetValue().toString());
        }
        function myYwlx(cmd) {
            if (cmd == "clear") {
                cbxAJLX.SetValue(null);
                cbxAJXZ.SetValue(null);
                cbxXZFL.SetValue(null);
                cbxXZXL.SetValue(null);
            }
        }
        function myAjlx(cmd) {
            if (cmd == "clear") {
                cbxAJXZ.SetValue(null);
                cbxXZFL.SetValue(null);
                cbxXZXL.SetValue(null);
            }
        }
        function myAjxz(cmd) {
            if (cmd == "clear") {
                cbxXZFL.SetValue(null);
                cbxXZXL.SetValue(null);
            }
        }
        function myXzfl(cmd) {
            if (cmd == "clear") {
                cbxXZXL.SetValue(null);
            }
        }
bubuko.com,布布扣

  注意:最后一级不用调用脚本进行清空

  本文主要解决了,多级联动过程中,联动数据不能及时清空的问题;本文只代表本人个人观点,希望广大博友提出好的建议和意见,谢谢~

ASPxComboBox控件联动效果bug改进,布布扣,bubuko.com

ASPxComboBox控件联动效果bug改进

标签:style   blog   class   code   java   ext   

原文地址:http://www.cnblogs.com/lonelyxmas/p/3705734.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!