一、實現(xiàn)的效果圖

創(chuàng)新互聯(lián)服務(wù)項目包括鄂城網(wǎng)站建設(shè)、鄂城網(wǎng)站制作、鄂城網(wǎng)頁制作以及鄂城網(wǎng)絡(luò)營銷策劃等。多年來，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢、行業(yè)經(jīng)驗、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，鄂城網(wǎng)站推廣取得了明顯的社會效益與經(jīng)濟(jì)效益。目前，我們服務(wù)的客戶以成都為中心已經(jīng)輻射到鄂城省份的部分城市，未來相信會繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任！

備注：

1、主要實現(xiàn)添加類別綁定到Ztree樹之后，select下拉框在不刷新頁面的情況下，通過Jquery重新綁定問題，增加用戶體驗度；

2、這個只是實現(xiàn)兩層的綁定，通過sql語句排列成樹狀結(jié)構(gòu)，然后綁定到select控件上；

select * from NewsCategoryorder by case when ParentId=0 then Id*10000 else ParentId*10000+Id end

二、主要代碼

html代碼

     不選父級類  

Jquery代碼

 　　　　　　　　　　　　　　//加載選擇欄 var html = ['不選父級模塊'];
var data = eval(json.msg);//轉(zhuǎn)換為json對象 var levelStr;//記錄層級值 for (var key in data) {
var str = data[key].itemvalue;
var _p = str.split("|")[2];
var _c = data[key].pId;
//判斷是否是二級分類  if (_p == _c) {
//判斷是否是一級分類   if (_p != "") {
                                    levelStr= "┗━┻━";
                                }
else {
                                    levelStr= "┗━";
                                }
                                html.push('' + levelStr + data[key].name + '');
                            }
                            $("select[name='pid']").empty().append(html.join(''));

json格式字符串

"[
{"id":31,"name":"u65b0u95fbu4e2du5fc3","pid":0,"itemvalue":"|0|"},
{"id":51,"name":"u4f01u4e1au5febu8baf","pid":31,"itemvalue":"|0|31|"},
{"id":52,"name":"u4f01u4e1au516cu544a","pid":31,"itemvalue":"|0|31|"},
{"id":53,"name":"u884cu4e1au52a8u6001","pid":31,"itemvalue":"|0|31|"},
{"id":54,"name":"u5173u4e8eu76dfu53cbu634cu634c","pid":0,"itemvalue":"|0|"},
{"id":55,"name":"u4f01u4e1au6982u51b5","pid":54,"itemvalue":"|0|54|"},
{"id":56,"name":"u4f01u4e1au6587u5316","pid":54,"itemvalue":"|0|54|"},
{"id":57,"name":"u4f01u4e1au53d1u5c55","pid":54,"itemvalue":"|0|54|"},
{"id":58,"name":"u8054u7cfbu6211u4eec","pid":54,"itemvalue":"|0|54|"},

{"id":65,"name":"u4ea7u54c1u670du52a1","pid":0,"itemvalue":"|0|"},
{"id":70,"name":"u63a8u8350u670du52a1","pid":65,"itemvalue":"|0|65|"},
{"id":71,"name":"u8ba1u8d39u65b9u5f0f","pid":65,"itemvalue":"|0|65|"},
{"id":72,"name":"u7528u6237u987bu77e5","pid":65,"itemvalue":"|0|65|"},
{"id":73,"name":"u7981u5bc4u8303u56f4","pid":65,"itemvalue":"|0|65|"},
{"id":75,"name":"u666eu901au5febu9012","pid":70,"itemvalue":"|0|65|70|"},
{"id":76,"name":"u7279u79cdu5febu4ef6","pid":70,"itemvalue":"|0|65|70|"}

......
]"

 涉及的知識點：

1、記錄層級值ItemValue的添加(即類別添加)

 　　　　if (model.ParentId == 0)
        {
            model.ItemValue= "|0|";
        }
else
        {            
            Express.Model.NewsCategory modelid= Express.BLL.NewsCategory.GetModel(model.ParentId);
            model.ItemValue= modelid.ItemValue + model.ParentId + "|";
        }

2、獲取的json字符串(json.msg)

　　　　if (Express.BLL.NewsCategory.Insert(model) > 0)
       {
return json.Serialize(new { code = 1, msg= GetJson() });
       }

　　//序列化，將對象轉(zhuǎn)化為JSON字符串  protected string GetJson()    {
//為啟用 AFAX 的應(yīng)用程序提供序列化和反序列化功能        System.Web.Script.Serialization.JavaScriptSerializer json = new System.Web.Script.Serialization.JavaScriptSerializer();
        List list = new List();
//獲取管理員模塊列表        list = Express.BLL.NewsCategory.Get();
//將對象轉(zhuǎn)換為JSON字符串   return json.Serialize(list);       
    }

網(wǎng)頁標(biāo)題：Jquery+json綁定帶層次下拉框（select控件）-創(chuàng)新互聯(lián)
文章源于：http://weahome.cn/article/dcecos.html