zoukankan      html  css  js  c++  java
  • EasyUI需注意的问题01

    一、EasyUI-Datagrid分页

    在创建数据表格(DataGrid)的时候,通过设置'pagination' 属性为 true,可以在数据表格的底部生成一个分页工具栏。

    <table id="dg" class="easyui-datagrid" 
           url="data/datagrid_data.json"
           pagination="true">
    	<thead>
    		<tr>
    			<th field="xxx" width="80">xxx</th>
                         <th field="xxx" width="80">xxx</th> 
                         <th field="xxx" width="80">xxx</th> 
    		</tr>
    	</thead>
    </table>

    当我们向指定的url请求数据时,pagination将会发送两个参数到服务器:page:页面,起始值1rows:每页显示行数在分页栏上,一般会显示总共有多少记录,当前显示的记录(第几页);因此服务器向前端发送数据的时候,除了数据记录之外,还需要传递当前查询总共有多少记录。而在EasyUI中,向datagrid传递的数据格式必须为字典类型的json数据。该数据包含两个键:total(当前查询的总记录数)、rows(返回的记录数据)分页思想:一般的分页会根据page和rows来决定返回的记录,跳过前面的(page-1)*rows条记录,返回剩下的rows条记录(少于rows条则全部返回)。对数据的筛选一般反正数据库中进行(当应用与数据库不在同一机子时,若在应用所在服务器进行数据筛选,会导致网络传输大量的无效记录,而当记录总数较大的时候,也会占用较多的内存进行数据的筛选)而在数据库中进行筛选,为了保证每次查到的数据的顺序是一致的,必须对某个唯一列进行排序(一般是主键)。具体的操作可以为:先查出前(page-1)*rows条记录的id,然后选择记录id不在查出数据之中的数据的前rows条记录(SELECT TOP rows FROM tableName WHERE id not in(SELECT TOP (page-1)*rows id from tableName order by id) order by id)这种分页当page很大的时候,会过滤掉大量的数据,以至于效率不高。SQLServer2005提供了一个row_number()函数用于分页,ROW_NUMBER() 就是生成一个顺序的行号,而生成顺序的标准是由后面紧跟的OVER(ORDER BY id)子句决定的:

    SELECT TOP rows *  FROM

    (
           SELECT top rows ROW_NUMBER() OVER (ORDER BY id) AS RowNo FROM TABLE
    ) AS A WHERE RowNo >  (page-1)*rows

    二、easyui-datetimebox日期时间控件

    通过官网的例子为datetimebox控件设置值时,如下:

    <input class="easyui-datetimebox" name="birthday" id="dt"
              data-options="required:true,showSeconds:true" value="03/04/2010 12:30:29" style="250px;height:30px;">

    结果显示的时候,时间部分是正确的,但日期部分确是当前日期(这是为什么呢),当通过getValue函数获取控件的值时,得到的时间格式是:

    yyyy-MM-dd hh:mm:ss

    于是,试着将时间格式也设置相同,就显示正确了。难道datetimebox只能支持上述的时间格式?

  • 相关阅读:
    js遍历Object所有属性
    使用JAVA开发微信公众平台(一)——环境搭建与开发接入
    使用Vue.js实现列表选中效果
    c#以POST方式模拟提交表单
    vue项目里的日期格式化
    Hadoop概念学习系列之Hadoop、Spark学习路线(很值得推荐)
    CentOS下的Mysql的安装和使用
    CentOS中zip压缩和unzip解压缩命令详解
    vue路由跳转传参数
    Linux上安装Hadoop集群(CentOS7+hadoop-2.8.0)
  • 原文地址:https://www.cnblogs.com/Jxwz/p/4509575.html
Copyright © 2011-2022 走看看