A summary of the application of JSON in the project

Source: Internet
Author: User
Tags tojson

I. Summary

When I first approached JSON, it was not clear what the JSON was, and then it was used in the project. Because I didn't understand the nature of JSON, I took a lot of detours when I first started using JSON. This summary of some JSON knowledge, summed up the main is to comb their own use of JSON some of the application scenarios, so that they have a deeper understanding of JSON, later in the project can be more proficient in the application of it.

Second, Summary:

1.json in the front end of the application:

A) Ajax+json usage scenarios:

Ajax handles logon validation information parsing JSON-formatted string objects and how Ajax obtains response data from the server Request.responsetext

Comment processing, using AJAX to submit the form's data to the server, the client parses the data from the JSON-formatted list type sent from the server:

Using AJAX to obtain server-side data, if the data from the server to the front-end is a JSON string form, in front of the reader to read the data, you need to first convert the string into a JSON-formatted object.

The eval () function in JS is to convert a JSON-formatted string into a JSON-formatted object.

The first thing to learn is the original Ajax, not the jquery (Ajax in jquery is more convenient), in the project with the original Ajax to interact with the server. The current side needs to be like a background asynchronous request a large amount of data, there must be a way for us to easily transfer the data from the background to the front end, such as the background to the front-end data is an array type, the background through the corresponding method of the array type of data into a JSON-formatted string, and then passed to the front end, In order to display the contents of a JSON-formatted string from the background to a corresponding location, the JSON-formatted string must first be converted to a JSON object (the Eval function) before the data can be read out (the second graph iterates through the retrieved background data).

At first if you are unfamiliar with JSON, you may encounter situations where you do not know how to read a JSON-formatted string that is uploaded from the background to the front-end (I do). This is the time to figure out the concept of JSON, there are many JSON tutorials on the web, generally from the most basic JSON things to introduce, for the first time I began to contact JSON, I looked at those JSON basic tutorial, I found that I still do not use JSON. Beginners should first understand the basics of JSON (to apply JSON in practice, to understand how JSON-formatted data is written and how to read JSON-formatted data).

2.json Foundation:

A) understand the JSON concept:

b) Understand the JSON syntax:

Address: http://www.w3school.com.cn/json/json_syntax.asp

1.json Value:

2.json Object Notation : {"FirstName": "John", "LastName": "Doe"}
3.json array notation (can contain multiple JSON objects):
var employees = [{"FirstName": "Bill", "LastName": "Gates"},{"FirstName": "George", "LastName": "Bush"},{"FirstName": "T Homas "," LastName ":" Carter "}];

How to read the JSON array:
employees[0].lastname;//gets the value of the LastName property of the first JSON object
for (Var i=0;i<employees.length;i++) {//js, iterates through all the values in the JSON array
alert (employees[i].firstname);
alert (employees[i].lastname);
}

var a={
"Employees": [
{"FirstName": "John", "LastName": "Doe"},
{"FirstName": "Anna", "LastName": "Smith"},
{"FirstName": "Peter", "LastName": "Jones"}
]
}
a.employees[0].lastname;//gets the value of the LastName property employees the first JSON object

c) Figuring out the difference between JSON and JSON strings (summary later)

Ajax+json in 3.jquery (the most used in the project):
After learning jquery, the practical use of Ajax in jquery, of course, is to send a request to the server

A) The Ajax base usage of jquery:
Gets the form information and passes that information to the server, the server returns the JSON array object as the front end gets, and then reads the JSON array object after the front-end fetch (the image describes the inaccurate, supplementary: The returned object can be traversed directly)
When form data is not available, it can be passed to the server directly after obtaining the form data as follows
Example one:

Example two: The server only passes a numeric type of data to the front end (the value can be obtained by outputting data directly, because the value of JSON can be numeric, as can be obtained by data[0])

b) Use of a complex point

1) When the form data is too long, you need to splice the data.

First serialize the form (The Red-box section, the object returned by the serialized form is a JSON array object that can be traversed to get the property name of each control and its corresponding property value, each control of the form must be written with the name and Value property value, otherwise it cannot be read as follows). We then stitch all the values into the JSON-formatted object we actually need.

Ajax section:

Add:

How to serialize a form in jquery: http://www.studyofnet.com/news/647.html

2) When the form data is long, the data processing method two

As with the first method above, when the form data is too long we need to stitch each property and its corresponding attribute value, so it will be a hassle to spell.

The following Tojson method to convert form data to JSON objects is also a good choice, so do not have to write the property name in the control, directly in the JS write also easy to check the error.

Tojson method needs to import Jquery-json Library (Tojson learning address: http://www.cnblogs.com/haogj/archive/2011/12/01/2271098.html)

The above summarizes how to get the values in the form and then pass the obtained values to the server. When the form data is relatively long, how to simply convert the value of the form into JSON-formatted data, and then pass its value to the server. A summary of the basics of JSON, a way to read JSON format (object) data

Let's summarize the system. , the JSON string differs from the JSON object to summarize how to read data from the server to the front end:

1. Learn the essential differences between JSON strings and JSON objects, learning address: http://www.haorooms.com/post/json_object_json_string

2. Learn more about how JSON strings go to JSON objects, how JSON objects go to JSON strings, and learn about addresses:

Example one:

Http://www.soso.io/article/25001.html

A summary of the application of JSON in the project

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.