Jquery ajax and Jquery plug-in Ztree

Source: Internet
Author: User

Jquery ajax was used in a recent project that requires a lot of new technologies for refreshing traffic. Previously, Jquery ajax was used because of the few requirements for refreshing traffic in the project. In addition, the previous company mainly used VS2003 for development, ah, this old antique is old enough to leave the company from the previous one, mainly because the company's main framework is in 2003 and there is no access to new things, so it leaves.

I used to explore jquery ajax myself, but I still use few projects. I thought I would not encounter many problems at first, but the results gave me a headache, big and small, I had a mouse drop problem (but I didn't have the idea of hitting a computer), so now I want to remember something.

Problem 1: the development environment is on VS2008, But. NET 2.0 is used, so I encountered a problem and found that ajax did not go into the background.

The test code is as follows:

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 ("querying") ;}, 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";  } 

Then, the result is: a JS syntax error is displayed on the page, and the web is found after searching. A piece of code is missing from the config file, so I copied the code to the web. <system. web> node, and then run successfully.

Question 2: Data in JSON format is returned in the background, and the received data in JS is stored as a JSON data object.

Because the IList <T> format is used when I obtain data in the background, I need to convert it to the JSON format type, so I used a method found on the Internet.

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

The front-end JS Code is as follows:

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) ;}}); // initialize the data (display the first page) onloadGrid (0 ); initData (0, 0 );});

An error occurred while running: JS error missing ']'. Then, I used FireBug tool to check whether the JSON value was obtained, in JSON format, ']' is not missing. Therefore, after running dataType: text in JS, the data is displayed successfully. I am really puzzled here. I don't know whether the conversion method in the background is incorrect or that in the front-end JS is incorrect. I have a question here. Please read it and let me know, thank you.

Problem 3: The preceding JSON-format data is bound to the Ztree, and an error occurs. Then I var an object on the page and assign the value to this value (copied from the Fire Bug ), bound successfully.

Check the Ztree API carefully and find that the bound data source must be a JSON object, but what I got earlier is a JSON string, so here we must convert the obtained data to a JSON object.

The Code is as follows:

View Code

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

This is a complete success.
Some code on the internet is everywhere. This is really depressing, so I will write down some of my problems.

We also recommend the ajax debugging tool FireBug and the jquery tree plug-in Ztree.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.