zoukankan      html  css  js  c++  java
  • Ajaxpro2 实现三级联动

    后台代码:

    这里用的企业库,大家可以根据实际情况取数据,

     Database database;
            DbCommand dbcmd;
            protected void Page_Load(object sender, EventArgs e)
            {
                AjaxPro.Utility.RegisterTypeForAjax(typeof(select));
                if (!IsPostBack)
                {
                    database = DatabaseFactory.CreateDatabase();
                    string sql = "select * from HM_AreaInfo where fathercode is null";
                    dbcmd = database.GetSqlStringCommand(sql);
                    DataSet ds = database.ExecuteDataSet(dbcmd);
                    WebHelper.BindDropDownList(ddlProvinceList, ds.Tables[0], "code", "AreaName","请选择");
                }
            }

            [AjaxPro.AjaxMethod]
            public DataTable getCityList1(string code)
            {
                database = DatabaseFactory.CreateDatabase();
                string sql = "select * from HM_AreaInfo where fathercode=@fathercode";
                dbcmd = database.GetSqlStringCommand(sql);
                database.AddInParameter(dbcmd, "@fathercode", DbType.String, code);
                DataSet ds = database.ExecuteDataSet(dbcmd);
                return ds.Tables[0];
            }

    这里是前台代码:

    <script language="javascript" type="text/javascript">
        $(document).ready(function() {
        $("[id$='ddlProvinceList']").change(function() {
                var res = HMb2b.Controls.select.getCityList1(this.value).value;
                var ddl = $("[id$='ddlCityList']");
                ddl.empty();

                if (res) {
                    ddl.css("display", "inline");
                    ddl.append("<option value=''>请选择</option>");
                    for (var i = 0; i < res.Rows.length; i++) {
                        ddl.append("<option value='" + res.Rows[i].Code + "'>" + res.Rows[i].AreaName + "</option>");
                    }
                }
            });
            $("[id$='ddlCityList']").change(function() {
                var res = HMb2b.Controls.select.getCityList1(this.value).value;
                var ddl = $("[id$='DropDownList1']");
                ddl.empty();
                ddl.append("<option value=''>请选择</option>");
                if (res) {
                    ddl.css("display", "inline");
                    for (var i = 0; i < res.Rows.length; i++) {
                        ddl.append("<option value='" + res.Rows[i].Code + "'>" + res.Rows[i].AreaName + "</option>");
                    }
                }
            });
        });
    </script>

    <table width="200" border="0" align="center" cellpadding="3" cellspacing="1" bordercolor="#FFFFFF"
        style="border-collapse: collapse">
        <tr align="center">
            <td height="20" colspan="2">
                <strong>AjaxPro实现二级联动</strong>
            </td>
        </tr>
        <tr class="tdbg">
            <td width="30%">
                省份
            </td>
            <td width="70%" align="left">
                <asp:DropDownList ID="ddlProvinceList" runat="server">
                </asp:DropDownList><asp:DropDownList ID="ddlCityList" runat="server" style="display:none">
                </asp:DropDownList><asp:DropDownList ID="DropDownList1" runat="server" style="display:none">
                </asp:DropDownList>
            </td>
        </tr>
      </table>

    这里的代码只是简单的实现了功能,并没有美化界面,等有时间的话,我会简单整理一下,重新编辑一下该文章,这里仅供大家参考

  • 相关阅读:
    CSRF的防御解决过程
    Spring生态研习【三】:Spring-kafka
    Spring生态研习【二】:SpEL(Spring Expression Language)
    Spring生态研习【一】:定时任务Spring-task
    给定一个大的任务,需要在考虑性能的情况下,快速处理完,并报告结果
    给定一个大于2的偶数,将其分解为两个质数的和
    一个求解平方根的算法题
    Kafka研究【一】:bring up环境
    LB+nginx+tomcat7集群模式下的https请求重定向(redirect)后变成http的解决方案
    IDEA使用笔记(八)——自动生成 serialVersionUID 的设置
  • 原文地址:https://www.cnblogs.com/Bright/p/2259842.html
Copyright © 2011-2022 走看看