一直在找关于jquery asp.net ajax方面的资料
很多文章都涉及到ashx与json交互
而这两个东东都不是太懂,首先来个ashx的,添加这种文件后,一般显示如下
using System;
namespace System.Web
{
public interface IHttpHandler
{
bool IsReusable { get; }
void ProcessRequest(HttpContext context);
}
}
其中ProcessRequest(HttpContext context)这个方法是我们关心的。在我们的.ashx文件中,我们就是要实现自已的ProcessRequest(HttpContext contex),用它来给客户端返回前端数据。
还有要解决的问题是C#的数据结构和javascript是完全不同的,所以C#的数据要返回给javascript处理,必须的找个桥梁。这里有两个选择:1.xml;2.JSON。因为这里只是简单的应用实现,所以我选择的是相对简单的JSON。
方案已定,下面在自己的.ashx文件中可以这么实现ProcessRequest(HttpContext contex)方法:
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string data = "[{name:/"fan/",age:26},{name:/"wang/",age:25}]";//构建的json数据
//下面两句是用来测试前台向此页面发出的查询字符
context.Response.Write(data);
}
前台js代码
$(document).ready(function(){
$.getJSON(
"AjaxHandler.ashx",//产生JSON数据的服务端页面
//对返回的JSON数据进行处理,本例以列表的形式呈现
function(json){
//循环取json中的数据,并呈现在列表中
// debugger;
$.each(json,function(i){
$("#cat-list").append("<li>name:"+json[i].name+" Age:"+json[i].age+"</li>")
})
});
});
再来,让我们了解一下什么是JSON
JSON定义
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,易于阅读和编写,同时也易于机器解析和生成。它基于ECMA262语言规范(1999-12第三版)中JavaScript编程语言的一个子集。 JSON采用与编程语言无关的文本格式,但是也使用了类C语言(包括C, C++, C#, Java, JavaScript, Perl, Python等)的习惯,这些特性使JSON成为理想的数据交换格式。
JSON的结构基于下面两点
JSON使用:
JSON以一种特定的字符串形式来表示 JavaScript 对象。如果将具有这样一种形式的字符串赋给任意一个 JavaScript 变量,那么该变量会变成一个对象引用,而这个对象就是字符串所构建出来的,好像有点拗口,我们还是用实例来说明。
这里假设我们需要创建一个User对象,并具有以下属性
您可以使用以下JSON形式来表示User对象:
{"UserID":11, "Name":"Truly", "Email":"zhuleipro◎hotmail.com"};
然后如果把这一字符串赋予一个JavaScript变量,那么就可以直接使用对象的任一属性了。
完整代码:
<script>
var User = {"UserID":11, "Name":"Truly", "Email":"zhuleipro◎hotmail.com"};alert(User.Name);</script>
实际使用时可能更复杂一点,比如我们为Name定义更详细的结构,使它具有FirstName和LastName:
{"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"}
完整代码:
<script>
var User = {"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"};alert(User.Name.FirstName);</script>
现在我们增加一个新的需求,我们某个页面需要一个用户列表,而不仅仅是一个单一的用户信息,那么这里就需要创建一个用户列表数组。
下面代码演示了使用JSON形式定义这个用户列表:
[{"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"},{"UserID":12, "Name":{"FirstName":"Jeffrey","LastName":"Richter"}, "Email":"xxx◎xxx.com"},{"UserID":13, "Name":{"FirstName":"Scott","LastName":"Gu"}, "Email":"xxx2◎xxx2.com"}]
完整代码:
<script>var UserList = [{"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"},{"UserID":12, "Name":{"FirstName":"Jeffrey","LastName":"Richter"}, "Email":"xxx◎xxx.com"},{"UserID":13, "Name":{"FirstName":"Scott","LastName":"Gu"}, "Email":"xxx2◎xxx2.com"}];alert(UserList[0].Name.FirstName);</script>
事实上除了使用"."引用属性外,我们还可以使用下面语句:
alert(UserList[0]["Name"]["FirstName"]); 或者 alert(UserList[0].Name["FirstName"]);
现在读者应该对JSON的使用有点认识了,归纳为以下几点:
小节:
本文通过一个实例演示,初步了解了JSON 的强大用途。可以归结如下: