城市级联Ajax

一、先说下数据库里面的设计：

Id AreaName Pid

1 北非地区部 0
2 东北欧地区部 0
3 东南非地区部 0
4 东南亚地区部 0
5 俄罗斯代表处 0

………………
17 阿尔及利亚 1
18 埃及 1
19 埃塞俄比亚 1
20 厄立特里亚 1

……

33 奥地利 2
34 保加利亚 2
35 波兰 2
36 波斯尼亚和黑塞哥维那 2
37 丹麦 2
38 芬兰 2
39 捷克 2

二，前台页面

    <script src="../js/jquery-1.9.0.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            //绑定省的数据，往后台发送一异步请求
            $.get("ProData.ashx", {}, function (data) {
                //把数据放到下面的省的下来列表里面去。
                $("#pro").html(data);
                //触发一下改变事件
                $("#pro").change();
            });

            $("#pro").change(function () {
                //把最后的选中的省的Id拿到。从后台加载city信息。
                $.post("GetCitysByProId.ashx", { proId: $(this).val() }, function (data) {
                    $("#city").html("");
                    $("#city").html(data);
                });
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <select id="pro">
        </select>
        <select id="city">
        </select>

三，两个一般处理程序

 

    /// <summary>
    /// ProData 的摘要说明
    /// </summary>
    public class ProData : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            BLL.AreaCountryBll bll = new BLL.AreaCountryBll();
            Model.AreaCountry model = new Model.AreaCountry();
            List<Model.AreaCountry> list = bll.GetModelList(" PId=0 ");
            StringBuilder sb = new StringBuilder();
            foreach (var areaCountry in list)
            {
                sb.AppendFormat("<option value='{0}'>{1}</option>", areaCountry.Id,areaCountry.AreaName);
            }

            context.Response.Write(sb.ToString());
        }

 

第二个一般处理程序

 

    /// <summary>
    /// GetCitysByProId 的摘要说明
    /// </summary>
    public class GetCitysByProId : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            int id = int.Parse(context.Request["proId"] ?? "0");
            BLL.AreaCountryBll bll=new BLL.AreaCountryBll();
            List<Model.AreaCountry> list = bll.GetModelList(" PId=" + id);
            StringBuilder sb = new StringBuilder();
            foreach (var model in list)
            {
                sb.AppendFormat("<option value='{0}'>{1}</option>", model.Id,model.AreaName);
            }
            context.Response.Write(sb.ToString());
        }

 

总结，没有使用JSON格式，还是用的字符串拼接，有需要的可以改下

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

posted @ 2013-12-28 11:19  那个故人  阅读(176)  评论(0)    收藏  举报