ASP.NET webform基于Jquery,AJAX的三级联动

主要html代码

<select id="province">
        <option value="0">--请选择省份--</option>
    </select>
    <select id="city">
        <option value="0">--请选择城市--</option>
    </select>
    <select id="area">
        <option value="0">--请选择地区--</option>
    </select>

JQuery代码

<script type="text/javascript">
        $(document).ready(function () {
            $.post("lianxi.aspx", { file2: 1 }, function (result) {
                var province = result.split('|');
                var newoption;
                for (var i in province) {
                    new option = new Option(province[i], province[i]);
                    $("#province")[0].options.add(newoption);
                }
            })
            $("#province").change(function () {
                $("#city")[0].options.length = 1;
                if ($("#province").val() == "0") {
                    return;
                }
                $.post("lianxi.aspx", { province: $("#province").val() }, function (result) {
                    var city = result.split('|'); var newoption;
                    for (var i in city) {
                        new option = new Option(city[i], city[i]);
                        $("#city")[0].options.add(newoption);
                    }
                })
            })
            $("#city").change(function () {
                $("#area")[0].options.length = 1;
                if ($("#city").val() == "0") {
                    return;
                }
                $.post("lianxi.aspx", { city: $("#city").val() }, function (result) {
                    var area = result.split('|'); var newoption;
                    for (var i in area) {
                        new option = new Option(area[i], area[i]);
                        $("#area")[0].options.add(newoption);
                    }
                })
            })
        })
    </script>

后台代码

 

 

protected void Page_Load(object sender, EventArgs e)
        {
            if (Request.Form["file2"] != null)
            {
                string sql = string.Format("select distinct province from proci");
                DataTable dt = sqlhelper.helper.ExecuteQuery(sql);
                string province = "";
                for (int i = 0; i < dt.Rows.Count; i++)
                {
                    province += "|" + dt.Rows[i][0].ToString();
                }
                Response.Write(province.Substring(1));
                Response.End();
            }
            if (Request.Form["province"] != null)
            {
                string province = Request.Form["province"].ToString();
                string sql2 = string.Format("select city from proci where province='{0}'", province);
                DataTable dt2 = sqlhelper.helper.ExecuteQuery(sql2);
                string city = "";
                for (int j = 0; j < dt2.Rows.Count; j++)
                {
                    city += "|" + dt2.Rows[j][0].ToString();
                }
                Response.Write(city.Substring(1));
                Response.End();
            }
            if (Request.Form["city"] != null)
            {
                string city = Request.Form["city"].ToString();
                string sql2 = string.Format("select dis from abcd where city='{0}'", city);
                DataTable dt2 = sqlhelper.helper.ExecuteQuery(sql2);
                string area = "";
                for (int j = 0; j < dt2.Rows.Count; j++)
                {
                    area += "|" + dt2.Rows[j][0].ToString();
                }
                Response.Write(area.Substring(1));
                Response.End();
            }
        }