使用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 parametersPageMethod("TestWithParams", ["a", "value", "b", 2], AjaxSucceeded, AjaxFailed); //With parameters  

第四步: 得到结果:

 

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

 

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

是不是很简单？？？？