[入门篇]Jquery读取.Net WebService Json数据
时间:2010-09-16 来源:灵动生活
public class ProductData
4、 添加ASP.NET Web Service 到工程中,命名为ProductServic.asmx,如下图:
此Web Service调用ProductData类,完成数据查询操作,具体代码如下:
|
注:
Ø 引用命名空间:System.Web.Script.Services.ScriptService
Ø 给方法添加注解:[ScriptMethod(ResponseFormat = TheResponseFormat, UseHttpGet = true/false)]
ResponseFormat:方法要返回的类型,一般为Json或者XML
UseHttpGet:true表示“Get”可以访问此方法
5、 在Defualt.aspx页面引用Jquery类库
引用Google网络jquery 类库http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js
或者本地类库<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
6、 在Defualt.aspx页添加如下HTML代码:
<div id="listContainer" class="container">
</div> |
Jquery会动态向id=ProductList的Table中添加查询到的数据
7、 在Defualt.aspx页添加如下样式代码:
|
8、 使用Jquery的Ajax方法调用Web Service中方法,代码如下:
$(document).ready(function () {
|
注:
$.ajax方法有以下属性:
Type: HTTP请求方法,在做查询操作时,经常用Get方法
contentType:在请求头部的类型,由于Web Service返回Json对象,此处值为:application/json; charset=utf-8
url:请求的URL地址
dataTyep:定义返回的类型
Success:调用成功时,要执行的方法
error:调用失败是,要执行的方法
9、 执行程序,效果如下: