关于EasyUI中DataGrid控件的一些使用方法总结

一，DataGrid         控件的工作流程

　　1，通过JavaScript将一个空白的div美化成一个空白的Datagrid模板

　　2，Datagrid模板通过制定的Url发送请求，获取数据

      3，Datagrid通过后台返回的Json将对应的数据按照Filed的名字进行匹配并显示

知道了这个流程那么，那么我们对整个的使用基本上有了百分之80的了解了

在第三步中，Datagrid会向后台发送一个请求，该请求是按照之前创建Datagrid时制定的url来访问的，

并且会自动添加两个参数

   　　　　　　　　　　①，page：当前的页数

　　　　　　　　　　　②，每页显示多少条数据

后台根据这两个条件就可以算出，需要查询的数据量（从第几条开始，需要查询几条）

begin=(page-1)*limt

开始记录=(当前页-1)*每页行数

如果当前页是4 每页显示4条

那么begin=(4-1)*4=12

可能这个地方会有疑问

第一页：1-4

第二页：5-8

第三页:9-12

第四页：13-16

那么起始条数应该是13啊

事实是这样的，因为在程序中0代表第一

所以在程序中是这样

第一页:0-3

第二页:4-7

第三页:8-11

第四页:12-15

 

这样那我们的查询语句就是select * from teacherInfo limit 12,4

 

但是你以为这样就ok了？

你图样图森破

 

其实Datagrid需要返回的json可以分为两大类

　　　　①，total  当前条件下查询的数据的总条数

　　　　②，rows 当前条件下所查询出的数据

 

只要有了这两条件前台就能算出，总共有多少页等次要信息

 

 

附上Datagrid返回Json的数据格式

 

{"total":28,"rows":[
    {"fileName":"001","productname":"Koi"},
    {"fileName":"002","productname":"Dalmation"},
    {"fileName":"002","productname":"Rattlesnake"},
   
]}
 

 

这里的fileName productname       分别对应两个不同的Filed的Name

也就是说每行有两列

一列为fileName productname

这样系统就会自动按照名字来匹配相应的值！