Jquery ajax 与 Jquery插件 Ztree

    最近一个项目中需要很多地方做无刷新技术，那么就用到了Jquery ajax，以前因为项目做无刷新的要求比较少点，又加上上个公司主要是用VS2003开发，哎这个老古董是够老啊，从 前一个公司离职，主要也是因为公司的主要框架是在2003，接触不到新的东西，所以离开的。

    因为以前自己也摸索过jquery ajax，但是还是实际项目却用的少，开始还以为不会遇到很多问题，结果却让我头疼呵呵，大大小小的问题，让我当初有砸鼠标的问题（砸电脑的想法却没有），所以现在记点东西。

   问题1：开发环境是在VS2008上，但是得使用.NET 2.0，所以就遇到了问题，发现竟然ajax竟然不进后台的方法。

   测试代码如下：

View Code

$(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); }
        });
    });

View Code

 [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格式类型的，所以使用了网上搜到的一个方法。

View Code

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代码如下：

View Code

$(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对象。

代码如下：

View Code

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

这下彻底成功啦。
折腾啊，网上有些代码到处都是错，这真让人郁闷，所以我把我所遇到的一些问题，记下来。

这里也推荐下ajax的调试工具：FireBug以及jquery树插件Ztree。

转载于:https://www.cnblogs.com/sibiyellow/archive/2012/04/23/JqueryajaxZtree.html