所谓的ajax.这里我们讲二种方法
方法一:(微软有自带ajax框架)
在asp.net里微软有自己的ajax框架.就是在页面后台.cs文件里引入 using system.web.services 空间 然后定义静态方法(方法前加上 [webmethod])
[webmethod]
public static string abc(string abc)
{
return abc;
}
好了,现在我们谈谈前台js怎么处理后台返回的数据吧,可利用jquery处理返回的纯html,json,xml等数据.这里我们演示返回返回的数据有string、集合(list)、类.
但都返回json格式(json轻量级比xml处理起来简单).看看前台是怎么解析这些数据的.
代码如下:
前台页面:
复制代码 代码如下:
br>http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
无标题页
dictionary
后台.cs文件
复制代码 代码如下:
using system;
using system.collections;
using system.collections.generic;
using system.configuration;
using system.data;
using system.linq;
using system.web;
using system.web.security;
using system.web.ui;
using system.web.ui.htmlcontrols;
using system.web.ui.webcontrols;
using system.web.ui.webcontrols.webparts;
using system.web.services;
public partial class default2 : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{
}
[webmethod]
public static string helloworld()
{
return 123--->456;
}
[webmethod]
public static string abc(string abc)
{
return abc;
}
[webmethod]
public static string getwish(string value1, string value2, string value3, int value4)
{
return string.format(祝您在{3}年里 {0}、{1}、{2}, value1, value2, value3, value4);
}
///
/// 返回集合
///
///
///
[webmethod]
public static list getarray(int i)
{
list list = new list();
while (i >= 0)
{
list.add(i--);
}
return list;
}
///
/// 返回一个复合类型
///
///
[webmethod]
public static class1 getclass()
{
return new class1 { id = 1, value = 牛年大吉 };
}
public class class1
{
public string id { get; set; }
public string value { get; set; }
}
}
利用jquery让返回的各类数据(string、集合(list)、类)以json数据格式返回,为什么要用到result.d
这里我们顺带讲下json
json简单讲就是javascript对象或数组.
　json形式一: javascript对象 { firstname: brett, lastname:mclaughlin, email: aaaa }
json形式二: javascript数组 [{ firstname: brett, lastname:mclaughlin, email: aaaa },
{ firstname: jason, lastname:hunterwang, email: bbbb}]
当然javascript 数组和对象可以互相嵌套.如形式一中的brett可以换成一个js数组或js对象.那微软的ajax返回的是哪种形式呢.是第一种.
微软框架默认返回一个 { d: 后台返回的数据 } 这里我们用以上示例中的测试到得比如
如上例的返回的是string类型的话firefox调试如下
当返回的是list类型的话firefox调试如下
返回的数据也是放在js对象中的d属性里面 所以说这就是为什么我们老是用result.d来取微软的框架返回的数据.
方法一不常用.一般用得多的还是方法二.
方法二:(建一个一般处理程序即.ashx文件)
用这种方法一般是我们要在ashx文件里手动写好返回的json格式的数据返回给前台用
ashx 你可以配成json格式一或json格式二
default.aspx页面js代码如下
复制代码 代码如下:
$.ajax({
type: post,
url: handler.ashx,
datatype: json,
success: function(data){
alert(data.name); //返回的为 json格式一(js对象)
/* 返回的为 json格式二(js对象)
$(data).each(function(i) {
alert(data[i].name);
});
*/
}
});
handler.ashx 代码如下
复制代码 代码如下:
using system;
using system.web;
using system.collections;
using system.collections.generic;
using system.web.script.serialization;
public class handler : ihttphandler {
public void processrequest (httpcontext context) {
javascriptserializer jss = new javascriptserializer();
context.response.contenttype = text/plain;
// 返回的为json格式一 js对象
string data = {\name\:\wang\,\age\:25};
// 返回的为json格式二 js数组
//string data = [{\name\:\wang\,\age\:25},{\name\:\zhang\,\age\:22}];
context.response.write(data);
}
public bool isreusable {
get {
return false;
}
}
}
以上基本上就第二种方法,可能有人不喜欢拼字符串.那有什么好办法呢?答案是有.微软对json有很好的支持.
拿上例子说我们只要把handler.ashx改一下就可以了
handler.ashx 代码如下
复制代码 代码如下:
using system;
using system.web;
using system.collections;
using system.collections.generic; // dictionary 键值对集合所需
using system.web.script.serialization; //javascriptserializer 类所需
public class handler : ihttphandler {
public void processrequest (httpcontext context) {
javascriptserializer jss = new javascriptserializer();
context.response.contenttype = text/plain;
dictionary drow = new dictionary();
drow.add(name, wang);
drow.add(age, 24);
context.response.write(jss.serialize(drow));
}
public bool isreusable {
get {
return false;
}
}
}
asp.net中的javascriptserializer为我们提供了很好的方法
jss.serialize(drow) 是把drow的dictionary (键和值的集合)数据类型转换成json数据格式
调试结果如下图 (上面例子是输出了一个键值多集合即一个json形式一的js对象)
如果要输出json形式二(js数组)呢? 我们也只要改动一部分就了
handler.ashx 代码如下
复制代码 代码如下:
using system;
using system.web;
using system.collections;
using system.collections.generic;
using system.web.script.serialization;
public class handler : ihttphandler {
public void processrequest (httpcontext context) {
javascriptserializer jss = new javascriptserializer();
context.response.contenttype = text/plain;
list> _list = new list>();
dictionary drow = new dictionary();
drow.add(name, wang);
drow.add(age, 24);
dictionary drow1 = new dictionary();
drow1.add(name, zhang);
drow1.add(age, 35);
_list.add(drow);
_list.add(drow1);
context.response.write(jss.serialize(_list));
}
public bool isreusable {
get {
return false;
}
}
}
调试结果如下图 (上面例子是输出了json形式二的js数组)
讲到这里基本概念也讲得差不多了. 这里再讲一个够常碰到的例子就是如何把datatabel转换成json格式从而好让前台页面调用.
就是在handler.ashx写上一个方法 
复制代码 代码如下:
///
/// datatable转json
///
///
///
private string dtb2json(datatable dtb)
{
javascriptserializer jss = new javascriptserializer();
arraylist dic = new arraylist();
foreach (datarow row in dtb.rows)
{
dictionary drow = new dictionary();
foreach (datacolumn col in dtb.columns)
{
drow.add(col.columnname, row[col.columnname]);
}
dic.add(drow);
}
return jss.serialize(dic);
}
其实也有把json格式转换成datatabel格式,方法如下
复制代码 代码如下:
///
/// json转datatable
///
///
///
private datatable json2dtb(string json)
{
javascriptserializer jss = new javascriptserializer();
arraylist dic = jss.deserialize(json);
datatable dtb = new datatable();
if (dic.count > 0)
{
foreach (dictionary drow in dic)
{
if (dtb.columns.count == 0)
{
foreach (string key in drow.keys)
{
dtb.columns.add(key, drow[key].gettype());
}
}
datarow row = dtb.newrow();
foreach (string key in drow.keys)
{
row[key] = drow[key];
}
dtb.rows.add(row);
}
}
return dtb;
}
我们让返回的json以表格的形式显示出来
那么前台页面js如下
复制代码 代码如下:
$.ajax({
type: post,
url: handler.ashx,
datatype: json,
success: function(data){
var table = $(
);
for (var i = 0; i o1 = data[i];
var row = $(
);
for (key in o1)
{
var td = $( );
td.text(o1[key].tostring());
td.appendto(row);}
row.appendto(table);
}
table.appendto($(#back));
}
});
由上例子 再讲两个js知识点
1. 之前我们取json里面的数据如果是返回的是数组的话是用data[i].name也可表示为data[i][name]
2. 如果要访问js对象的所有属性那么遍历js对象.
复制代码 代码如下:
success: function(data){
$(data).each(function(i) {
for(key in this) // 遍历js对象的所有属性
alert(data[i][key]);
//这里就不能换成 data[i].key 否则key成了属性而不是上面的key变量
});
}
也有把前台json数据传到后台后解析成datatabel
这里我把datatabel软成json和json转成datatabel写成一个例子.下载地址如下
源码下载
如果大家对asp.net的序列化与反序列化感兴趣想一探究竟的话