C#+Jquery实现省地市三级联动下拉

来源：互联网发布：印度经济知乎编辑：程序博客网时间：2024/05/17 23:50

//前台：

  <div>       省份： <asp:DropDownList ID="ddlTest1" runat="server" ></asp:DropDownList>       城市： <asp:DropDownList ID="ddlTest2" runat="server">        <asp:ListItem Text="请选择" Value=""></asp:ListItem>       </asp:DropDownList>    </div>

//JQ：

    <script>        $(function () {        //省地市下拉联动            $("#ddlTest1").change(function () {                $.ajax({                    url: "DataPage.aspx?id=" + $("#ddlTest1").val(),                    success: function (data) {                        //alert(data);                         $("#ddlTest2").empty();                        $("#ddlTest2").append("<option value=''>请选择</option>") ;                        var lst = data.split('|');                        for (var i = 0; i < lst.length; i++) {                            $("#ddlTest2").append("<option value='" + lst[i].split(',')[0] + "'>" + lst[i].split(',')[1] + "</option>")                        }                    }                });            });        });    </script>

//DataPage后台：

if (Request["id"] != null)                {                    string sql = "select * from AreaInfo where CONVERT(varchar(10), parentId)='" + Request["id"].ToString() + "'";                    DataTable dt = db.SelectData(sql);                    string str = "";                    for (int i = 0; i < dt.Rows.Count; i++)                    {                         //1,湖北省|2,xxx|4,xxx                        str += dt.Rows[i]["id"].ToString() + "," + dt.Rows[i]["areaName"].ToString() + "|";                    }                    if (str != "")                    {                        str = str.TrimEnd('|');                    }                    Response.Write(str);                    Response.End();                }

0 0