To implement ajax calls in webService, add this code:
// To allow ASP.NET AJAX to be used to call this web service from a script, please uncomment the following line.
[System.Web.Script.Services.ScriptService]
Code download/201008/yuanma/WebService2.rar
//Call without parameters
$(document).ready(function() {
$('#btn1') .click(function() {
$.ajax({
type: "POST", //Access WebService and use Post method to request
contentType: "application/json", //WebService will return Json type
url: WebServiceURL "WebService1.asmx/HelloWorld", //The combination of address and method name for calling WebService---- WsURL/method name
data: "{}", //Here are the parameters to be passed , the format is data: "{paraName:paraValue}", you will see below
dataType: 'json',
success: function(result) { //Callback function, result, return value
$ ('#dictionary').append(result.d);
}
});
});
});
//Calling
with parameters $(document).ready(function() {
$("#btn2").click(function() {
$.ajax({
type: "POST",
contentType: "application/json",
url: WebServiceURL "WebService1.asmx/GetWish",
data: "{value1:'All your wishes come true',value2:'Everything goes well',value3:'Niu Niu Niu', value4:2009}",
dataType: 'json',
success: function(result) {
$('#dictionary').append(result.d);
}
});
});
});
//Return the collection (quoted from the Internet, which explains the problem)
$(document).ready(function() {
$("#btn3").click(function() {
$.ajax({
type: "POST",
contentType: "application/json",
url: WebServiceURL " WebService1.asmx/GetArray",
data: "{i:10}",
dataType: 'json',
success: function(result) {
$(result.d).each (function() {
//alert(this);
$('#dictionary').append(this.toString() " ");
//alert(result.d.join( " | "));
});
}
});
});
});
//Return composite type
$( document).ready(function() {
$('#btn4').click(function() {
$.ajax({
type: "POST",
contentType: "application /json",
url: WebServiceURL "WebService1.asmx/GetClass",
data: "{}",
dataType: 'json',
success: function(result) {
$(result.d).each(function() {
//alert(this);
$('#dictionary').append(this['ID'] " " this['Value'] );
//alert(result.d.join(" | "));
});
}
});
});
});
//Return DataSet(XML)
$(document).ready(function() {
$('#btn5').click(function() {
$.ajax({
type: "POST",
url: WebServiceURL "WebService1.asmx/GetDataSet",
data: "{}",
dataType: 'xml', //The returned type is XML, the same as before Json, different
success: function(result) {
//Demonstrate the capture
try {
$(result).find("Table1").each(function() {
$('#dictionary').append($(this).find("ID").text() " " $(this).find("Value").text());
});
}
catch (e) {
alert(e);
return;
}
},
error: function(result, status) { / /If there is no above capture error, the callback function here will be executed
if (status == 'error') {
alert(status);
}
}
});
});
});
//Ajax provides feedback to users, using ajaxStart and ajaxStop methods to demonstrate callbacks for ajax tracking related events. These two methods can be added to jQuery objects Callback before and after Ajax
//But the monitoring of Ajax is global
$(document).ready(function() {
$('#loading').ajaxStart(function( ) {
$(this).show();
}).ajaxStop(function() {
$(this).hide();
});
});