Three data types returned by the ajax processing server, ajax Data Types

Source: Internet
Author: User

Three data types returned by the ajax processing server, ajax Data Types

The principle is very simple and the structure remains unchanged. It only changes the way data is returned.

1. Text/HTML format
The processing of such return types is simple and can be directly used as strings. For ease of use, it is encapsulated into the following functions:

/*** @ Function use ajax to dynamically exchange data (in Text/HTML format) * @ param url the page on which the request is to be submitted * @ param jsonData the data to be submitted, use Json to pass * @ param getMsg. This function can obtain the processed data */function ajaxText (url, jsonData, getMsg) {// create an Ajax object. ActiveXObject is compatible with IE5, 6 var oAjax = window. XMLHttpRequest? New XMLHttpRequest (): new ActiveXObject ("Microsoft. XMLHTTP "); // open the request to oAjax. open ('post', url, true); // method, URL, asynchronous transmission // send request var data = ''; for (var d in jsonData) // assemble data + = (d + '=' + jsonData [d] + '&'); oAjax. setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); oAjax. send (data); // receives the response. oAjax is triggered when something is returned on the server. onreadystatechange = function () {if (oAjax. readyState = 4 & oAjax. status = 200) {if (getMsg) getMsg (oAjax. responseText );}}}

The data format returned by the server is as follows:
For example:

// The returned result is in xml format // header ("Content-Type: text/xml; charset = UTF-8"); // The returned result is in text or Json format header ("Content-Type: text/html; charset = UTF-8 "); // disable caching to ensure normal data submission, rather than caching data headers (" Cache-Control: no-cache "); $ username =$ _ POST ['username']; // obtain the username if (empty ($ username) echo 'enter username '; else if ($ username = 'acme') echo 'user name registered '; else echo 'user name available ';

The call format is as follows:

url = 'abc.php';var jsonData={username:'acme',passw:'acme'};ajaxText(url,jsonData,getMsg);function getMsg(msg){ //do something}

2. XML format

The returned result is an xml dom object. parsing the data is similar to html dom programming. for example, you can use name to obtain the tag object (in the array form), obtain the expected tag object from the array, and then obtain the text value from the tag object.
The function is as follows:

/*** @ Function use ajax to dynamically exchange data (in XML format) * @ param url the page on which the request is to be submitted * @ param jsonData the data to be submitted, use Json to pass * @ param tagName the tag name for obtaining the value * @ param getMsg this function can get the processed data */function ajaxXML (url, jsonData, tagName, getMsg) {// create an Ajax object. ActiveXObject is compatible with IE5 and 6 var oAjax = window. XMLHttpRequest? New XMLHttpRequest (): new ActiveXObject ("Microsoft. XMLHTTP "); // open the request to oAjax. open ('post', url, true); // method, URL, asynchronous transmission // send request var data = ''; for (var d in jsonData) // assemble data + = (d + '=' + jsonData [d] + '&'); oAjax. setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); oAjax. send (data); // receives the response. oAjax is triggered when something is returned on the server. onreadystatechange = function () {if (oAjax. readyState = 4 & oAjax. status = 200) {var oXml = oAjax. responseXML; // The returned xml dom object var oTag = oXml. getElementsByTagName (tagName); var tagValue = oTag [0]. childNodes [0]. nodeValue; if (getMsg) getMsg (tagValue );}}}

The data format returned by the server is as follows:
For example:

// The returned header is in xml format ("Content-Type: text/xml; charset = UTF-8"); // The returned header is in text or Json format ("Content-Type: text/html; charset = UTF-8 "); // disable caching to ensure normal data submission, rather than caching data headers (" Cache-Control: no-cache "); $ username = $ _ POST ['username']; // obtain the username if (empty ($ username )) echo '<user> <mes> enter the user name </mes> </user>'; // These tags can be customized to else if ($ username = 'acme ') echo '<user> <mes> user name registered </mes> </user> '; else echo '<user> <mes> user Name available </mes> </user> ';

The call format is as follows:

var url = 'abc.php';var jsonData = {username:'acme'};ajaxXML(url,jsonData,'mes',getMsg);function getMsg(msg) {   //do something }

3. Return json

The function is as follows:

/*** @ Function uses ajax to dynamically exchange data (in Text/HTML format ), however, the returned text data is Json. * @ param url refers to the page on which the request is to be submitted * @ param jsonData refers to the data to be submitted, use Json to pass * @ param getMsg. This function can obtain the processed data */function ajaxJson (url, jsonData, getMsg) {// create an Ajax object. ActiveXObject is compatible with IE5, 6 var oAjax = window. XMLHttpRequest? New XMLHttpRequest (): new ActiveXObject ("Microsoft. XMLHTTP "); // open the request to oAjax. open ('post', url, true); // method, URL, asynchronous transmission // send request var data = ''; for (var d in jsonData) // assemble data + = (d + '=' + jsonData [d] + '&'); oAjax. setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); oAjax. send (data); // receives the response. oAjax is triggered when something is returned on the server. onreadystatechange = function () {if (oAjax. readyState = 4 & oAjax. status = 200) {var json = eval ('+ oAjax. responseText + '); // parses the passed string into a json object if (getMsg) getMsg (json );}}}

The data format returned by the server is as follows:

For example:

// The returned result is in xml format // header ("Content-Type: text/xml; charset = UTF-8"); // The returned result is in text or Json format header ("Content-Type: text/html; charset = UTF-8 "); // disable caching to ensure normal data submission, rather than caching data headers (" Cache-Control: no-cache "); $ username =$ _ POST ['username']; // obtain the username if (empty ($ username) echo '{" mes ": "Enter the user name"} '; else if ($ username = 'acme') echo' {"mes": "The user name has been registered "}'; else echo '{"mes": "User Name available "}';

The call format is as follows:

url = 'abc.php';var jsonData={username:'acme',passw:'acme'};ajaxText(url,jsonData,getMsg);function getMsg(msg){ //do something}

For ease of use, you can merge the three functions. The combined functions are as follows:

/*** @ Function use ajax to dynamically exchange data * @ param url the page on which the request is to be submitted * @ param jsonData the data to be submitted, use Json to pass * @ param getMsg. This function can obtain the processed data * @ param type, when text/xml/json * @ param tagName type = xml, this parameter is set to the Tag Name of the text to be obtained * @ return none */function ajax (url, jsonData, getMsg, type, tagName) {// create an Ajax object. ActiveXObject is compatible with IE5, 6 var oAjax = window. XMLHttpRequest? New XMLHttpRequest (): new ActiveXObject ("Microsoft. XMLHTTP "); // open the request to oAjax. open ('post', url, true); // method, URL, asynchronous transmission // send request var data = ''; for (var d in jsonData) // assemble data + = (d + '=' + jsonData [d] + '&'); oAjax. setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); oAjax. send (data); // receives the response. oAjax is triggered when something is returned on the server. onreadystatechange = function () {if (oAjax. readyState = 4 & oAjax. status = 200) {if (type = 'text') {if (getMsg) getMsg (oAjax. responseText);} else if (type = 'json') {var json = eval ('+ oAjax. responseText + '); // parses the passed string into a json object if (getMsg) getMsg (json);} else if (type = 'xml ') {var oXml = oAjax. responseXML; // The returned xml dom object var oTag = oXml. getElementsByTagName (tagName); var tagValue = oTag [0]. childNodes [0]. nodeValue; if (getMsg) getMsg (tagValue );}}}}

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.

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.