一,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控件的一些使用方法总结的更多相关文章

  1. EasyUI 中 DataGrid 控件 列 如何绑定对象中的属性

    EasyUI 中 DataGrid 控件 是我们经常用到的控件之一, 但是 DataGrid 控件 在绑定显示列时却不支持对象属性绑定. 模型如下: public class Manager impl ...

  2. EasyUI中datagrid控件的使用 设置多行表头(两行或多行)

    EasyUI中的datagrid控件十分强大,能生成各种复杂的报表,现在因为项目需要,需要生成一个表头两行的表,找了一些说明文档,以下用一个实例来说明一下: 第一种方法: $('#divData'). ...

  3. easyui 中Datagrid 控件在列较多且无数据时,列显示不全的解决方案

    在onLoadSuccess 中加入如下代码就OK啦 $('#dg3').datagrid({ onLoadSuccess:function(data){ if(data.total==0){ var ...

  4. easyui中tree控件添加自定义图标icon

    来源于:http://blog.163.com/lintianhuanhai@126/blog/static/165587366201421704420256/ <!DOCTYPE html&g ...

  5. EasyUI:datagrid控件简介

    EasyUI:datagrid控件简介 1,水平滚动条属性: //显示滚动条 fitColumns:false //不显示滚动条 fitColumns:true

  6. easyUI的datagrid控件日期列不能正确显示Json格式数据的解决方案

    EasyUI是一套比较轻巧易用的Jquery控件,在使用过程中遇到一个问题,它的列表控件——datagrid, 在显示日期列的时候,由于后台返回给页面的数据是Json格式的,其中的日期字段,在后台是正 ...

  7. easyUI的datagrid控件日期列格式化

    转自:https://blog.csdn.net/idoiknow/article/details/8136093 EasyUI是一套比较轻巧易用的Jquery控件,在使用过程中遇到一个问题,它的列表 ...

  8. winform中DataGrid控件的宽度设置

    最近修改一个win5.0的PDA程式,碰到一个问题.就是给DataGrid控件绑定数据的时候,这个控件的宽度不能调整,有时候数据较长,就显示不全.然后想在程式里自定义它的宽度,设置不成功.然后网上没找 ...

  9. WPF中DataGrid控件内Button的Command和CommandParameter的绑定

    场景:视频上传功能,上传列表使用DataGrid控件,视频有不同的状态对应不同的操作,DataGrid中最后一列为操作列,里面是Button控件.希望点击Button后执行对应的操作,但是设置Butt ...

随机推荐

  1. Win7安装Docker

    系统环境 1. windows 7 旗舰版64位 i5-2450M CPU  8G内存 2.支持“ Hardware Virtualization Technology”,并且,“virtualiza ...

  2. homebrew & brew cask使用技巧及Mac软件安装

    homebrew 安装 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/m ...

  3. [BZOJ4518]征途

    4518: [Sdoi2016]征途 Time Limit: 10 Sec  Memory Limit: 256 MB Description Pine开始了从S地到T地的征途. 从S地到T地的路可以 ...

  4. 卷积神经网络的变种: PCANet

    前言:昨天和大家聊了聊卷积神经网络,今天给大家带来一篇论文:pca+cnn=pcanet.现在就让我带领大家来了解这篇文章吧. 论文:PCANet:A Simple Deep Learning Bas ...

  5. asp.net core中负载均衡场景下http重定向https的问题

    上周欣喜地发现,微软官方终于针对 asp.net core 在使用负载均衡的情况下从 http 强制重定向至 https 的问题提供了解决方法. app.UseForwardedHeaders(new ...

  6. input响应慢问题解决办法

    input[file]标签的accept属性可用于指定上传文件的 MIME类型 . 例如,想要实现默认上传图片文件的代码,代码可如下: <input type="file" ...

  7. 创建单页web app, 如何在chrome中隐藏工具栏 地址栏 标签栏?

    问题描述: 为使用更大的屏幕空间,在访问web应用的使用,如何隐藏地址栏.工具栏? 解决办法: 1. chrome的application mode 选项--->更多工具---->添加到桌 ...

  8. h5之scrollIntoView控制页面元素滚动

    如果滚动页面也是DOM没有解决的一个问题.为了解决这个问题,浏览器实现了一下方法,以方便开发人员如何更好的控制页面的滚动.在各种专有方法中,HTML5选择了scrollIntoView()作为标准方法 ...

  9. uwp版的音乐播放器练手

    UWP项目之音乐播放器 这个项目本来是我女朋友的一个小作业,她做不出来,结果只能是我来代劳.经过几天的时间虽然赶出来了,但是自己不是很满意,还有很多不满意的地方,因此决定在最近的一段时间内,重新完成. ...

  10. 【数据结构与算法】一致性Hash算法及Java实践

    追求极致才能突破极限 一.案例背景 1.1 系统简介 首先看一下系统架构,方便解释: 页面给用户展示的功能就是,可以查看任何一台机器的某些属性(以下简称系统信息). 消息流程是,页面发起请求查看指定机 ...