关于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

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

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

EasyUI中datagrid控件的使用设置多行表头(两行或多行)
EasyUI中的datagrid控件十分强大,能生成各种复杂的报表,现在因为项目需要,需要生成一个表头两行的表,找了一些说明文档,以下用一个实例来说明一下: 第一种方法: 1 $('#divData' ...
VB.net数据库编程中DataGrid控件的使用技巧
VB.net数据库编程中DataGrid控件的使用技巧如何用同一个DataGrid显示不同的数据表:如何用DataGrid显示主表/明细表的内容:如何用DataGrid分页显示或编辑数据表的记录.这 ...
有关WPF中DataGrid控件的基础应用总结
基础说明 DataGrid是WPF提供的基础控件,它可以非常轻松的呈现出一张表格,本文章会按照从易到难的顺序依次将DataGrid的使用方法进行解说,除了MSDN上给出的最基本的例子之外,给出了三个比 ...
WPF中DataGrid控件
WPF中DataGrid控件的个别属性使用 //设置不可自动拉伸宽度dataGrid.CanUserResizeColumns = false;//第一列不可见dataGrid.HeadersVisi ...
asp.net findcontrol html控件,findcontrol-在ASP.NET中查找控件的更好方法
findcontrol-在ASP.NET中查找控件的更好方法我有一个复杂的asp.net表单,在一个表单中甚至有50到60个字段,例如FindControl(),在MultiView中我有GridV ...
WPF 中DataGrid控件显示和设置数据
一.基础知识 1.DataGrid控件:用来显示数据的控件,从对象集合中获取信息并在具有行和单元格的网格中显示信息.每行和单独的对象相对应,并且每列和对象的某个属性相对应. 2.在DataGrid 中 ...
C#中DataGrid控件的基本使用
datagrid控件的作用简单点说就是将表格显示出来,用的多的是直接链接数据库文件,也可以自己见一个表格对象,链接到datagrid控件,下面是一个简单的例子 1 //xinjiabiao 2 Dat ...
easyui之datagrid控件分析
/** * datagrid - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * ...
easyui被activeX控件挡住的解决方法
问题描述: 在页面中插入activeX地图控件的时候发现头部的下拉菜单被挡住了,设置z-index不起作用,使用网上找到的方法设置wmode为opaque也不起作用,如下图所示: 解决方法: 经过一翻 ...
Asp.net中DataGrid控件的自定义分页
使用实现起来虽然比较方便,但是效率不高,每次都需要读取所有页(整个记录集),而加载的只是其中一页,造成了资源的浪费,记录多又会使效率变得很低.下面通过DataGrid的自定义分页功能来减少资源使用和提 ...

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

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

最新文章

热门文章