使用JQuery调用ASP.NET的Web Services

 

我个人非常喜欢使用JQuery。这里是个实用JQuery来调用asp.net的web service的例子。非常简单。

下面是实现这个方法的代码:

 

第一步:

定义两个测试用的web方法:

[WebMethod()] public static int TestNoParams() { return 1; } [WebMethod()] public static string TestWithParams(string a, int b) { return a + b.ToString(); }   

第二步：在页面中引用JQuery库:

 

<mce:script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" mce_src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></mce:script>

同时我借助下面这个帮助函数来调用页面方法:

<mce:script type="text/javascript"><!-- function PageMethod(fn, paramArray, successFn, errorFn) { var pagePath = window.location.pathname; //Create list of parameters in the form: //{"paramName1":"paramValue1","paramName2":"paramValue2"} var paramList = ''; if (paramArray.length > 0) { for (var i=0; i<paramArray.length; i+=2) { if (paramList.length > 0) paramList += ','; paramList += '"' + paramArray[i] + '":"' + paramArray[i+1] + '"'; } } paramList = '{' + paramList + '}'; //Call the page method $.ajax({ type: "POST", url: pagePath + "/" + fn, contentType: "application/json; charset=utf-8", data: paramList, dataType: "json", success: successFn, error: errorFn }) ;} // --></mce:script>   

第三步: 现在你可以在页面中添加简单的如下javascript脚本调用web service的方法:

PageMethod("TestNoParams", [], AjaxSucceeded, AjaxFailed); //No parameters
PageMethod("TestWithParams", ["a", "value", "b", 2], AjaxSucceeded, AjaxFailed); //With parameters
 
 

第四步: 得到结果:

 

function AjaxSucceeded (result) { alert(result.d); }   

 

上面就是简单的实现了ajax调用web service。如果你的.asmx文件在其它路径，请修改参数’pagePath’ .

是不是很简单？？？？