12--------图书分类的异步联动

Jquery代码

<script src="../js/jquery-1.7.1.min.js"></script>
    <script>
        $(function () {
            //获取图书的类型
            GetBookTypeList(1, 0);
            //第一级改变的时候
            $("#type1").change(function () {
                GetBookTypeList(2, $(this).val());
            });
            $("#type2").change(function () {
                GetBookTypeList(3, $(this).val());
            });
        });
        //type为分级
        //pid为当它的父id
        function GetBookTypeList(type,pid) {
            $.getJSON(
                "GetBookTypeList.ashx",
                { "type": type, "pid": pid },
                function (data) {
                    //接收传过来的参数,做判断,如果有数据,将他们的他们的值添加到select标签中
                    var typeList = $("#type" + type);
                    typeList.empty();
                    if (data.length <= 0) {
                        typeList.append("<option value='0'>此项无子分类</option>");
                    } else {
                        $.each(data, function (index, item) {
                            //[{ "TypeId": 1, "TypeTitle": "童书", "TypeParentId": 0 }, { "TypeId": 3, "TypeTitle": "教辅", "TypeParentId": 0 }, { "TypeId": 4, "TypeTitle": "小说", "TypeParentId": 0 }]                       


                            typeList.append("<option value=" + item.TypeId + ">" + item.TypeTitle + "</option>");
                            //编辑循环加载下一级的目录,因为只有3级所有type最大的值只能为2,如果为3下面type+1将超限
                            if (type < 3) {
                                GetBookTypeList(type + 1, typeList.val());
                            }
                        });
                    }
                });
        };
    </script>

  一般处理程序的代码

context.Response.ContentType = "text/plain";
            int type = Convert.ToInt32(context.Request["type"]);
            int pid = Convert.ToInt32(context.Request["pid"]);

            string strWhere = " TypeParentId=";
            if (type == 1)
            {
                strWhere += "0 ";
            }
            else
            {
                strWhere += pid + " ";
            }
            BLL.BookType btBll = new BLL.BookType();
            List<Model.BookType> listBT= btBll.GetModelList(strWhere);
            System.Web.Script.Serialization.JavaScriptSerializer js = new System.Web.Script.Serialization.JavaScriptSerializer();
            context.Response.Write( js.Serialize(listBT));

  网页代码

分类:</td>
                <td>
                    <select id="type1" name="type1"></select>
                    <select id="type2" name="type2"></select>
                    <select id="type3" name="type3"></select>
                </td>

  数据库 数据结构

posted on 2016-04-17 21:59  努力的活着_在人间  阅读(272)  评论(0)    收藏  举报

导航