https://www.hangge.com/blog/cache/detail_1980.html
四、Ajax请求数据之:一次性全部获取
1,条目为数组的情况
(1)假设服务器上数据文件(data.txt)里的数据如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
|
(2)我们只需要通过 ajax 配置项制定请求的地址即可。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
|
(3)运行结果如下:
2,条目为对象的情况
(1)假设服务器上数据文件(data.txt)里的数据如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
|
(2)页面代码如下。可以看到除了通过 ajax 配置项指定请求的地址,还要设置下每列绑定的属性。
1 2 3 4 5 6 7 8 |
|
五、Ajax请求数据之:服务端分页
前面的样例中,分页都是在客户端这边做的。但如果数据量特别大(上万条),建议在后台做分页。也就是说前台每次只读取当前一页的数据。虽然这样做会增加代码复杂度,但可以让页面响应更快。
1,客户端代码
- 这次的 Ajax 我们使用对象来配置。这种方式更加灵活且功能更强大些。
- 服务端返回的数据条目同上面一样,可以是数组也可以是对象,这里我以对象为例。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
|
2,服务端代码(data.php)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 |
|
3,效果图
(1)运行效果如下:
(2)同时通过请求抓取可以发现:不管是进行翻页操作、或是改变每页条目数、或是输入搜索内容、或是点击列头排序,表格都会发起请求并刷新数据。
(3)而服务端返回的数据如下:
附一:对返回的数据进行处理
1,基本介绍
有时从服务器上获取到的数据可能无法直接用于表格显示,需要先做些转换处理。这个只需通过 ajax.dataSrc 配置属性即可实现。
2,使用样例
(1)这里我们将返回结果中,所有的姓名前都加个“@”符号。
(2)代码如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
|
附二:刷新数据(重新加载数据)
1,不改变原来的 url
注意:第二个参数设为 false 的话,会保持当前的选中页。
1 2 3 4 |
|
2,改变 url
1 2 |
|
附三:禁止表格初始化时就去自动请求数据
1,问题描述
默认情况下,如果我们配置了 ajax 地址,当表格初始化后它便会自动发起 ajax 请求去获取数据。但有的时候我们并不希望它一开始就自动请求数据,而是手动控制它去请求(比如点击一个按钮后再发起请求)。
2,解决办法
(1)首先通过 iDeferLoading 和 serverSide 这两个属性设置,让表格不会自动发起请求。
1 2 3 4 5 |
|
(2)后面如果想请求数据时,调用 draw() 方法即可。
1 |
|
(3)除了 draw() 方法,使用前面介绍的刷新数据方法也是可以的。
1 2 3 4 5 6 7 8 9 |
|
原文出自:www.hangge.com 转载请保留原文链接:https://www.hangge.com/blog/cache/detail_1980.html