First create an ASPX page to write a client control <input type= "button" id= "Ajaxdemo"
Value= "Ajaxdemo" >
The ASPX background page writes a simple method, the code is as follows:
Copy Code code as follows:
[WebMethod]
public static string ABC (string ABC)
{
return ABC;
}
Must be declared as static methods, and they must be annotated with the [WebMethod] attribute. But there is no static method in the WebService, its object can be list, DataSet, class object, etc. ...
Next you should consider how to get the foreground client control to call the backend method ... At this time Jqury debut.
Introducing the jquery class library on the page
<script type= "Text/javascript"
Src= "Jquery/jquery-1.3.2-vsdoc2.js" ></script>
Add script code to the page as follows:
Copy Code code as follows:
<script type= "Text/javascript" >
$ (). Ready (function () {
$ ("#AjaxDemo"). Click (function () {
$.ajax ({
Type: "POST",
URL: "Default.aspx/abc",
Data: "{' ABC ': ' Test '}",
ContentType: "Application/json; Charset=utf-8 ",
Success:function (msg) {alert (msg);}
})
})
}
)
</script >
That's it! A lot of things are jquery class library to help us finish, we discussed here is how to use, concrete inside how to achieve, we do not care!
jquery also has a lot of methods like $.ajax for us to use. You can try!
Add: Pay attention to building 3.5 of the project, if it is 2.0. The configuration file will be a lot less referenced if you are building 2.0 projects. Build a 3.5. 3.5 of the configuration file to cover 2.0 of the project can!
The above code pops up "{d:test}" if it succeeds because he returns a string and we can change it back to the JSON object.
Modify the jquery code as follows
Copy Code code as follows:
$ (). Ready (
function () {
$ ("#AjaxDemo"). Click (function () {
$.ajax ({
Type: "POST",
URL: "Default.aspx/abc",
Data: "{' ABC ': ' Test '}",
DataType: "JSON",
ContentType: "Application/json; Charset=utf-8 ",
Success:function (msg) {alert (MSG.D);}
})
})
}
}
We set the data he returned is a JSON object, now we can use the returned JSON object, according to the d:test, we can obviously see the key is D, the value is test, then we use the returned data MSG object directly point D, we can get test, After the code has been modified. Now it's test.