其中服务端相对简单,唯一麻烦的就是客户端,因为返回的是DataTable,但是到了客户端,在没有自动提示的情况下我们并
不知道调用什么方法才可以将表中的数据遍历出来,只有那些勤奋的程序员或许会用浏览器的js调试器查看这其中的奥秘,而这里
我们会简单的介绍里面的方法。
首先是获得value后的里面存在哪些方法以及变量:
方法或变量名 |
简介 |
Columns |
保存表中存在的列 |
Rows |
保存表中存放的数据 |
addColumn(name,type) |
向表中添加新的列 |
addRow(row) |
向表中添加新的一行数据 |
toJSON() |
返回JSON字符串 |
如果我们要遍历其中的数据,可以通过循环遍历Rows,这里要注意不能用for in去遍历,这样你仅仅只会把里面的方法和变量遍历
而不是数据。如果要知道里面有多少数据,可以通过*.Rows.length来访问。
访问具体哪一行通过Rows[index]的方式即可,如果要方位其中的一个数据可以直接通过Rows[index].列名来访问。当然你也
可以通过这种方式来访问,最后的结果是一致的:Rows[index][列名]
2.保存来自客户端的DataTable
上面我们看到方法addColumn以及addRow或许你会觉得这些功能有什么用,自然有这个方法当然会有它的用处,下面讲述
的就是如何将客户端的DataTable返回到服务端。当然这里客户端的DataTable其实就是采用json方式形成的而已,仅仅只是
AjaxPro提供了对应的转换。
下面我们就开始将客户端的DataTable传送到客户端。
首先是服务端的代码:
DataTable saveTable(DataTable table)
{
table;
}
这里服务端的代码很简单,仅仅只是将DataTable原路返回。
下面是客户端代码(重点)
1 <script type="text/javascript">
2 window.onload =
3 var ntable =
Ajax.Web.DataTable();
4 ntable.addColumn("id","System.Int32"
5 var r1 =
{
6 'id':1
};
8 var r2 =
9 'id':2
ntable.addRow(r1);
12 ntable.addRow(r2);
13 TestAjax.saveTable(ntable);
14
15 16 17 18 content.innerHTML += rtable.Rows[r]['id'] + "<br />"
19 }
20 21 </script>
22 <div id="content" >
23
24 </div>
其中我们接触到了很多新的东西,比如Ajax.Web.DataTable,这个就是AjaxPro用来在客户端表示DataTable的对象,
下面就是我们之前介绍过的方法,唯一的仅仅就这个类型。
这里注意看每行的数据,我们采用的是对象字符串的形式进行封装的,这就是为什么我们在获取到DataTable类型数据
之后可以直接通过*.Rows[index].列名的方式能够访问的来源。
3.扩展
如果你需要一次性将多个DataTable同时传送到客户端,AjaxPro也提供了Ajax.Web.DataSet,其中仅仅只有一个
方法那就是:addTable(t)用来将表添加到DataSet中。同时还支持Ajax.Web.Dictionary和Ajax.Web.NameValueCollection
五、传送数组类型数据
1.首先我们先举例
服务端代码如下:
[AjaxMethod]
2 [] getIntArray()
{
4 return new int[] {
1,
2,128)">3,128)">4,128)">5,128)">6,128)">7
};
8 [] getStringArray()
10 string[] {
1s",0)">2s
3s4s5s11 }
客户端如下:
4
var iarray =
TestAjax.getIntArray().value;
6 var r = 0; r < iarray.length; r++
) {
7 content.innerHTML += iarray[r] + "<br />"
9
var sarray =
TestAjax.getStringArray().value;
11 var rs = 0 ; rs < sarray.length; rs++
12 content.innerHTML += sarray[rs] + "<br />"
15 </script>
16 <div id="content" >
17
18 </div>
其实最终返回到客户端之后AjaxPro并没有自己重新创建一个数组,而是直接使用js中原生自带的
Array,所以关于将数组传送到服务端部分省略。
2.自定义类型数组
原本打算单独放一章去讲述如何传递自定义类型的数据,但是想到传递数组这里要需要涉及到,所以这里就一并讲了。
首先我们先小试牛刀,传递一条数据。
依然还是服务端代码(加自定义的类):
1
class TestData
string ID {
get;
set; }
5
7 TestData getTestData()
9 {
11 ID =
1"
13 }
然后是客户端代码:
1 <script type="text/javascript">
2 window.onload =
3 4
5 var custom =
TestAjax.getTestData().value;
6 alert(custom.ID);
7 8 </script>
其实自定义数据的传送更简单写,因为最后到客户端的对象跟你在服务端写的类的格式完全一致,所以方便调用。
→_→ 应该会有人会想能不能写方法,这里我可以直接告诉你,AjaxPro会直接忽略掉。
扩展:
里面的数据也可以是其他的自定义的类或者数组,因为json基本都能够表示。?﹏?搞那么多层,我想应该会
晕吧。
下面我们开始传送自定义类型的数组。
服务端代码如下:
string[] StrArray {
TestData[] getTestData()
TestData[]{
11 TestData{
12 ID =
,13 StrArray =
dds }
},128)">15 16 ID =
217 StrArray =
18 }
20 }
接着是客户端代码
var r = 0 ; r < custom.length; r++
7 content.innerHTML += custom[r].ID + "<br />"
10 </script>
11 <div id="content" >
13 </div>
我相信那些有这比较好的json基础的,看到现在应该明白了什么了吧。只要是json能够表示的数据在客户端都是能够
表示出来的,所以我们介绍到这。其实关于数据的传送就可以告一段落了。
(编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!