Analysis of Ajax request JSON data and JS parsing (sample Analysis) _jquery

Since the touch of jquery has been like the front-end development, and deeply deeply affected by the front-end development of the strong and important. Also want to asp.net grievances, in fact, asp.net is not bloated, the man who says it's bloated is nothing more than someone who doesn't know it, maybe they've seen some asp.net. Low-level programmers are constantly dragging controls into the page and then discovering that the generated page contains a lot of junk code, and almost all of the logical processing is written on the server End, feel the server pressure too much. In fact, just getting started asp.net people will have the habit of dragging controls, but when you go deeper you will find that the final ASP.net development model is the same as PHP, JSP and other Web development mode is the same, PHP is html+css+js+php language, asp.net is HTML +css+js+c# language, the only difference is server-side language (for developers), if you see here also said ASP.net is very bloated, because of the need for the. NET Framework support, then why not say JSP is very bloated? JSP also needs the support of Java Virtual machine Ah! All Web development is based on client request-server-side return data-the pattern of client reprocessing data, and the benefit of the ASP.net development model is that it separates server-side and client code well, without nesting server-side code in HTML Of course, this pattern has now been used by almost all kinds of web development.

Pulled away. We have to master today very little, I prefer to write a demo with very little code, so that everyone is easier to master (the content is a bit low-level, great God please bypass).

We built one of these Web projects:

First write the client's HTML code

Copy Code code as follows:

<table>
<thead>
<tr>
<td> School Number </td>
<td> name </td>
<td> class </td>
<td> Sex </td>
<td> Tel </td>
</tr>
</thead>
<tbody></tbody>
</table>
<input id= "Btnget" type= "button" value= "Load Data"/>

JS Code

Copy Code code as follows:

$ (function () {
$ ("#btnget"). Click (function () {
$.ajax ({
Type: "Post",
DataType: "JSON",
URL: "Data.ashx",
Success:function (msg) {
var str = "";
for (i in msg) {
STR + + "<tr><td>" + msg[i].id + "</td><td>" + msg[i].name + "</td><td>" + Msg[i].cla + "</td><td>" + msg[i].sex + "</td><td>" + Msg[i].tel + "</td></tr>";
}
$ ("Tbody"). Append (str);
}
});
});
});

to make the table look good, let's define its style.

Copy Code code as follows:

<style type= "Text/css" >
Table {
Border-collapse:collapse;
}
Table TD {
Text-align:center;
border:1px solid Gray;
PADDING:3PX 10px;
}
</style>

then write the server-side code that returns the JSON data

Copy Code code as follows:

String data = "[id\": \ "2010324268\", \ "name\": \ "Lin Yu \", "cla\": \ "10 software \", \ "sex\": \ "men \", "tel\": \ "13800138000\"},{\ "id\": \ "2010324256\", \ "name\": \ "Dick", "cla\": \ "10 Network \", "sex\": \ "female", "tel\": \ "10010\"},{\ "id\": \ "2010324264\", \ "name\": \ "john \", "cla\": \ "10 software \", "sex\": \ "men \", \ "tel\": \ "10086\"}] ";
Context. Response.Write (data);

Here I have the JSON data formatted directly. In general, you need to read the data from the database and then put it together in JSON format, or you can use some other people write the serialized JSON data of the class, of course, I would like to suggest that you write one, to generate a class library to facilitate later use.

If you need to explain what JSON is, it is a data format that is tied to some data, such as XML, form: [{"id": "1", "Name": "John", "Age": "},{" "id": "2", "Name": "Dick", "Age": "18"}] Such a format.

This should be the basic technology that every web developer should master.