jQuery EasyUI 数据网格 - 设置排序

  本实例演示如何通过点击列表头来排序数据网格(DataGrid)。

  数据网格(DataGrid)的所有列可以通过点击列表头来排序。您可以定义哪列可以排序。默认的,列是不能排序的,除非您设置 sortable 属性为 true。

  创建数据网格(DataGrid)

  

  url="datagrid8_getdata.php"

  title="Load Data" iconCls="icon-save"

  rownumbers="true" pagination="true">

  

  

  

  

  

  

  

  

  

  

  

Item ID Product ID List Price Unit Cost Attribute Stauts

  我们定义一些可排序的列,包含 itemid、productid、listprice、unitcost 等等。'attr1' 列和 'status' 列不能排序。

  当排序时,数据网格(DataGrid)将发送两个参数到远程服务器:

  sort:排序列字段名。

  order:排序方式,可以是 'asc' 或者 'desc',默认值是 'asc'。

  服务器端代码

  $page = isset($_POST['page']) ? intval($_POST['page']) : 1;

  $rows = isset($_POST['rows']) ? intval($_POST['rows']) : 10;

  $sort = isset($_POST['sort']) ? strval($_POST['sort']) : 'itemid';

  $order = isset($_POST['order']) ? strval($_POST['order']) : 'asc';

  $offset = ($page-1)*$rows;

  $result = array();

  include 'conn.php';

  $rs = mysql_query("select count(*) from item");

  $row = mysql_fetch_row($rs);

  $result["total"] = $row[0];

  $rs = mysql_query("select * from item order by $sort $order limit $offset,$rows");

  $items = array();

  while($row = mysql_fetch_object($rs)){

  array_push($items, $row);

  }

  $result["rows"] = $items;

  echo json_encode($result);

  下载 jQuery EasyUI 实例

  jeasyui-datagrid-datagrid8.zip

  本文转载自:w3cschool(编辑:雷林鹏 来源:网络 侵删)

雷林鹏分享:jQuery EasyUI 数据网格 - 设置排序的更多相关文章

  1. 雷林鹏分享:jQuery EasyUI 数据网格 - 设置冻结列

    jQuery EasyUI 数据网格 - 设置冻结列 本实例演示如何冻结一些列,当用户在网格上移动水平滚动条时,冻结列不能滚动到视图的外部. 为了冻结列,您需要定义 frozenColumns 属性. ...

  2. 雷林鹏分享:jQuery EasyUI 数据网格 - 自定义排序

    jQuery EasyUI 数据网格 - 自定义排序 如果默认的排序行为不满足您的需求,您可以自定义数据网格(datagrid)的排序行为. 最基础的,用户可以在列上定义一个排序函数,函数名是 sor ...

  3. EasyUI 数据网格 - 设置排序并自定义排序

    数据网格(DataGrid)的所有列可以通过点击列表头来排序.您可以定义哪列可以排序.默认的,列是不能排序的,除非您设置 sortable 属性为 true. 当排序时,数据网格(DataGrid)将 ...

  4. 雷林鹏分享:jQuery EasyUI 数据网格 - 条件设置行背景颜色

    jQuery EasyUI 数据网格 - 条件设置行背景颜色 本教程将向您展示如何根据一些条件改变数据网格(datagrid)组件的行样式.当 listprice 值大于 50 时,我们将为该行设置不 ...

  5. 雷林鹏分享:jQuery EasyUI 数据网格 - 格式化列

    jQuery EasyUI 数据网格 - 格式化列 以下实例格式化在 easyui DataGrid 里的列数据,并使用自定义列的 formatter,如果价格小于 20 就将文本变为红色. 为了格式 ...

  6. 雷林鹏分享:jQuery EasyUI 数据网格 - 自定义分页

    jQuery EasyUI 数据网格 - 自定义分页 数据网格(datagrid)内置一个很好特性的分页功能,自定义也相当简单.在本教程中,我们将创建一个数据网格(datagrid),并在分页工具栏上 ...

  7. 雷林鹏分享:jQuery EasyUI 数据网格 - 添加复选框

    jQuery EasyUI 数据网格 - 添加复选框 本实例演示如何放置一个复选框列到数据网格(DataGrid).通过复选框,用户将可以选择 选中/取消选中 网格行数据. 为了添加一个复选框列,我们 ...

  8. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建自定义视图

    jQuery EasyUI 数据网格 - 创建自定义视图 在不同的情况下,您可能需要为数据网格(datagrid)运用更灵活的布局.对于用户来说,卡片视图(Card View)是个不错的选择.这个工具 ...

  9. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建页脚摘要

    jQuery EasyUI 数据网格 - 创建页脚摘要 在本教程中,我们将向您展示如何在数据网格(datagrid)页脚显示摘要信息行. 为了显示页脚行,您应该设置 showFooter 属性为 tr ...

随机推荐

  1. MongoDB基本信息

    一.MongoDB简介 来源:在2007年,由纽约一个叫10gen的创业团队开发,公司现在叫做MongoDB Inc,最初被开发为PAAS(平台即服务). 数据库类型:基于分布式文件存储的数据库.由C ...

  2. CentOS 7 Tomcat 8 9 基于APR库性能优化

    Tomcat可以使用Apache Portable Runtime来提供卓越的性能及可扩展性,更好地与本地服务器技术的集成.Apache Portable Runtime是一个高度可移植的库,位于Ap ...

  3. CentOS7中OpenVPN的配置

    最近需要在openstack中集成openvpn功能,故熟悉了一下openvpn的搭建流程,记录下来,供参考 版本:openvpn-2.3.4.tar.gz 下载地址:http://pan.baidu ...

  4. selenium 定位密码软键盘

    from selenium import webdriver import time driver = webdriver.Chrome() driver.maximize_window() driv ...

  5. MariaDB与MySQL

    一.MariaDB安装部署 tar zxvf mariadb-5.5.31-linux-x86_64.tar.gz mv mariadb-5.5.31-linux-x86_64 /usr/local/ ...

  6. Mac 下 实现终端跳转 服务器 不用输入密码

    首先需要安装 expect 安装 expect  需要 tcl 依赖 第一步 下载tcl http://www.tcl.tk/software/tcltk/downloadnow84.tml 将下载好 ...

  7. mysql_study_4

    索引 ALTER TABLE 表名字 ADD INDEX 索引名 (列名); CREATE INDEX 索引名 ON 表名字 (列名); 索引的效果就是加快查询速度,当表中数据不够多的时候是感受不出他 ...

  8. vue-cli3.0+node.js+axios跨域请求session不一样的问题

    一.问题重述 使用的是,前后端分离,前端vue+axios请求,后端使用node搭建服务端接口,遇到的问题是,我通过登录接口吧数据存储型在session,我登录上以后,发现再次验证登录(另一个接口)的 ...

  9. jdbc之工具类DBUtil的使用

    首先回顾一下jdbc的使用方法: 1. 注册驱动 2. 建立连接 3. 建立statement 4. 定义sql语句 5. 执行sql语句,如果执行的是查询需遍历结果集 6. 关闭连接 其中建立连接和 ...

  10. 让策划也能轻松修改数据的方法:运用Excel2Json2Object插件将xml表格转为Object导入脚本

    让策划也能轻松修改数据的方法:运用Excel2Json2Object插件将xml表格转为Object导入脚本 运用Excel2Json2Object插件将xml表格转为Object导入脚本 下载地址 ...