Ajax--ajax Call Data Summary

In the personnel system to add batch changes in the function, you need to pass the foreground data to the backstage. Background and run a series of actions.

By querying and learning to understand the ability to pass values through Ajax into the background and manipulate the data in the background.

That's a simple point. Is the way Ajax calls the background. Through learning and practice. Learn several forms of Ajax call data, and now summarize:

1. Ajax calls the data of a non-participating background method

jquery Front Code:

       Ajax calls the no-reference background method        $ (function () {            $ ("#btnok"). Click (function () {                $.ajax ({                    type: "POST",        // The Ajax way for post (get way to transmit data length limit)                    URL: "Demo.aspx/hello",         //demo.aspx for the target file, Hello for the method in the target file                    contentType: " Application/json ",        //value                    method success:function (data) {      ///Successful return value after trigger                        alert (DATA.D);          (back)})})        ;

Foreground form controls:

        <input id= "Btnok" type= "button" value= "click return Hello"/>

Background code:

        The non-reference method of the Ajax call        [WebMethod] public        static string Hello ()        {            return "Hello ajax!";        }

Execution Result:

2. Ajax calls have data in the background method

jquery Front Code:

       The AJAX call has a reference background method of        $ (function () {            $ ("#btnName"). Click (function () {                var strname = $ ("#txtName"). Val ();   StrName gets the value entered in the text box                $.ajax ({                    type: "Post",  //ajax in the way of post (get method has a limit on the length of the transmitted data)                    ContentType: " Application/json ",        ///value method                    URL:" Demo.aspx/getname ",  //demo.aspx as the target file, getName as the target file in the                    data:" { StrName: ' + strName + '} ',  //strname is the reference for the background method, strName the value entered in the text box                    contentType: "Application/json",        //                    method Success:function (Result) {      ///Successful return value triggered by                        alert (RESULT.D);          (back)})})        ;

Foreground form controls:

            <input id= "txtname" type= "text"/><input id= "btnname" type= "button" value= "OK"/>

Background code:

        The method of the parameter of the AJAX call                 [WebMethod] public               static string GetName (String strName)        {            return "welcome" +STRNAME;        }

Execution Result:

watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvc3vuzxfpbmc=/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/ Dissolve/70/gravity/center ">

3. Ajax calls the background method to return the array's data

jquery Front Code:

      The AJAX call back method returns the array        $ (function () {            $ ("#btnReArr"). Click (function () {                $.ajax ({                    type: "POST",  // Ajax in the way of post (get way to transmit data length is limited)                    contentType: "Application/json",        //value method                    URL: "Demo.aspx/getarray",  //demo.aspx is the target file, GetArray is the method in the target file                    contentType: "Application/json",        //value                    success: function (Result) {      //Successful callback value is triggered after the method                        alert (RESULT.D);          (back)})})        ;

Foreground form controls:

            <input id= "Btnrearr" type= "button" value= "click Return Array"/>

Background code:

       Ajax calls the method of returning an array        [WebMethod] public        static list<string> GetArray ()        {            list<string> li = New List<string> ();            for (int i = 0; i <; i++)                Li. ADD (i + "");            return li;        }    

Execution Result:

4. Ajax calls the data in XML

jquery Front Code:

     Ajax calls the data in XML        $ (function () {            $ ("#btnMaXML"). Click (function () {                $.ajax ({                    dataType: ' xml '),  // Ajax in the way of post (get way to transmit data length limit)                    URL: "Demoxml.xml",   //Direct write XML name                    success:function (XML) {      // method to trigger after successful callback value                        //Find XML element                              $ (XML). Find ("Data>item"). each (function () {                            var $DM = $ (this);                            var $id = $dm. Find ("id");   Gets the value of the ID field                            var $class = $dm. Find ("class");//Gets the value of the class field                            alert ($id. Text () + "," + $class. Text ())                    })}                })            })        });

Foreground form controls:

            <input id= "Btnmaxml" type= "button" value= "Click return XML Data"/>

XML code:

<?xml version= "1.0" encoding= "Utf-8"?
> <data>       <item>         <id>1</id>         <class> language </class>       </item >       <item>         <id>2</id>         <class> math </class>      </item>     </ Data>    

Execution Result:

There are some limitations to the method of using Ajax to invoke the backend. Because his back-office method is static, it is difficult to use the controls in the form in the method. But such a way of passing value to the background in the past is simpler and easier to understand.

(Free delivery on Write your own source code address: http://download.csdn.net/detail/suneqing/7265593)

Ajax--ajax Call Data Summary