Jquery ajax 與 Jquery插件 Ztree

    最近一個項目中需要很多地方做無刷新技術，那么就用到了Jquery ajax，以前因為項目做無刷新的要求比較少點，又加上上個公司主要是用VS2003開發，哎這個老古董是夠老啊，從 前一個公司離職，主要也是因為公司的主要框架是在2003，接觸不到新的東西，所以離開的。

    因為以前自己也摸索過jquery ajax，但是還是實際項目卻用的少，開始還以為不會遇到很多問題，結果卻讓我頭疼呵呵，大大小小的問題，讓我當初有砸鼠標的問題（砸電腦的想法卻沒有），所以現在記點東西。

   問題1：開發環境是在VS2008上，但是得使用.NET 2.0，所以就遇到了問題，發現竟然ajax竟然不進后台的方法。

   測試代碼如下：

$(document).ready(function() {
        $.ajax({
            type: "POST",
            url: "default.aspx/HelloWord",
            dataType: "text",
            contentType: "application/json; charset=utf-8",
            beforeSend: function(XMLHttpRequest) {
                $('#show').text("正在查詢");
            },
            success: function(msg) {
                alert(eval("(" + msg + ")").d);
            },
            error: function(xhr, msg, e) { alert(msg); }
        });
    });

 [System.Web.Services.WebMethod()]
 public static string HelloWord()
 {
       return "Hello Word";
  } 

然后運行得到的卻是：看到頁面上有個JS語法錯誤，經過查找發現web.config文件里面缺少一段代碼，所以我把這段代碼拷到web.config的<system.web>節點下，然后運行成功。

<httpModules>
            <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        </httpModules>

  問題2：后台返回的是JSON格式的數據，JS接收數據存為JSON數據對象。

  因為我后台取得的數據時IList<T>格式的，所以需要轉換為JSON格式類型的，所以使用了網上搜到的一個方法。

public static string ObjectToJson<T>(string jsonName, IList<T> IL) 
    { 
        StringBuilder Json = new StringBuilder(); 
        Json.Append("["); 
        if (IL.Count > 0) 
        { 
            for (int i = 0; i < IL.Count; i++) 
            { 
                T obj = Activator.CreateInstance<T>(); 
                Type type = obj.GetType(); 
                PropertyInfo[] pis = type.GetProperties(); 
                Json.Append("{"); 
                for (int j = 0; j < pis.Length; j++) 
                { 
                    Json.Append("\"" + pis[j].Name.ToString() + "\":\"" + pis[j].GetValue(IL[i], null) + "\""); 
                    if (j < pis.Length - 1) 
                    { 
                        Json.Append(","); 
                    } 
                } 
                Json.Append("}"); 
                if (i < IL.Count - 1) 
                { 
                    Json.Append(","); 
                } 
            } 
        } 
        Json.Append("]"); 
        return Json.ToString(); 
    }

  前台JS代碼如下：

$(document).ready(function() {
        $.ajax({
            type: "POST",
            url: "programList.aspx/getClassData",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function(msg) {
                alert(eval("(" + msg + ")").d);
            },
            error: function(xhr, msg, e) { alert(msg); }
        });
        // 初始化數據(顯示第一頁)
        onloadGrid(0);
        InitData(0, 0);
    });

運行又得到錯誤：JS錯誤缺少']',然后我用FireBug工具查看是否取到JSON值，查看得到，數據已經有響應，並且符合JSON格式而並沒有缺少']'， 所以我又將JS里面的dataType：text，運行后彈出數據成功。這里我真的很納悶，不知道是我后台的轉換方法不對，還是前台JS的不對，這里發一疑問，麻煩看過的，知道的說聲，這里先謝謝啦。

問題3：前面得到JSON格式的數據，綁定到Ztree上，發生錯誤，然后我在頁面上自己var一個對象，賦值這段值（從Fire Bug 中拷貝出來），綁定成功。

仔細的查看Ztree的API，發現綁定的數據源必須是JSON對象，而我前面得到的卻是JSON格式的字符串，所以這里我們必須把得到的數據轉換為JSON對象。

代碼如下：

 success: function(msg) {
         treeData = jQuery.parseJSON(msg);
         var json = eval('(' + treeData.d + ')');
         zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, json);
  }

這下徹底成功啦。
折騰啊，網上有些代碼到處都是錯，這真讓人郁悶，所以我把我所遇到的一些問題，記下來。

這里也推薦下ajax的調試工具：FireBug以及jquery樹插件Ztree。