jQuery EasyUI 树形菜单 - 树形网格添加分页

  本教程展示如何向带有动态加载特性的树形网格(TreeGrid)添加分页。

  创建树形网格(TreeGrid)

  启用树形网格(TreeGrid)的分页特性,必须添加 'pagination:true' 属性,这样页面加载时就会向服务器发送 'page' 和 'rows' 参数。

  

  data-options="

  url: 'treegrid4_getdata.php',

  rownumbers: true,

  pagination: true,

  pageSize: 2,

  pageList: [2,10,20],

  idField: 'id',

  treeField: 'name',

  onBeforeLoad: function(row,param){

  if (!row) { // load top level rows

  param.id = 0; // set id=0, indicate to load new page rows

  }

  }

  ">

  

  

  

  

  

  

  

  

  

Name Quantity Price Total

  服务器端代码

  treegrid4_getdata.php

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

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

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

  $id = isset($_POST['id']) ? intval($_POST['id']) : 0;

  include 'conn.php';

  $result = array();

  if ($id == 0){

  $rs = mysql_query("select count(*) from products where parentId=0");

  $row = mysql_fetch_row($rs);

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

  $rs = mysql_query("select * from products where parentId=0 limit $offset,$rows");

  $items = array();

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

  $row['state'] = has_child($row['id']) ? 'closed' : 'open';

  array_push($items, $row);

  }

  $result["rows"] = $items;

  } else {

  $rs = mysql_query("select * from products where parentId=$id");

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

  $row['state'] = has_child($row['id']) ? 'closed' : 'open';

  $row['total'] = $row['price']*$row['quantity'];

  array_push($result, $row);

  }

  }

  echo json_encode($result);

  function has_child($id){

  $rs = mysql_query("select count(*) from products where parentId=$id");

  $row = mysql_fetch_array($rs);

  return $row[0] > 0 ? true : false;

  }

  发送到服务器的参数包括:

  page:要加载的当前页面。

  rows:页面尺寸大小。

  id:父行的 id 值,从服务器返回的行将被添加。

  当展开一个行节点时,'id' 值是大于 0 的。 当改变页码时,'id' 值应该被设置为 0 来放置加载子行。

  下载 jQuery EasyUI 实例

  jeasyui-tree-treegrid4.zip

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

雷林鹏分享:jQuery EasyUI 树形菜单 - 树形网格添加分页的更多相关文章

  1. 雷林鹏分享:jQuery EasyUI 树形菜单 - 树形菜单添加节点

    jQuery EasyUI 树形菜单 - 树形菜单添加节点 本教程向您展示如何附加节点到树形菜单(Tree).我们将创建一个包含水果和蔬菜节点的食品树,然后添加一些其他水果到已存在的水果节点. 创建食 ...

  2. 雷林鹏分享:jQuery EasyUI 树形菜单 - 树形菜单拖放控制

    jQuery EasyUI 树形菜单 - 树形菜单拖放控制 当在一个应用中使用树(Tree)插件,拖拽(drag)和放置(drop)功能要求允许用户改变节点位置.启用拖拽(drag)和放置(drop) ...

  3. 雷林鹏分享:jQuery EasyUI 树形菜单 - 树形菜单加载父/子节点

    jQuery EasyUI 树形菜单 - 树形菜单加载父/子节点 通常表示一个树节点的方式就是在每一个节点存储一个 parentid. 这个也被称为邻接列表模型. 直接加载这些数据到树形菜单(Tree ...

  4. 雷林鹏分享:jQuery EasyUI 树形菜单 - 树形网格动态加载

    jQuery EasyUI 树形菜单 - 树形网格动态加载 动态加载树形网格有助于从服务器上加载部分的行数据,避免加载大型数据的长时间等待.本教程将向您展示如何创建带有动态加载特性的树形网格(Tree ...

  5. 雷林鹏分享:jQuery EasyUI 树形菜单 - 树形网格惰性加载节点

    jQuery EasyUI 树形菜单 - 树形网格惰性加载节点 有时我们已经得到充分的分层树形网格(TreeGrid)的数据. 我们还想让树形网格(TreeGrid)按层次惰性加载节点. 首先,只加载 ...

  6. 雷林鹏分享:jQuery EasyUI 数据网格 - 添加分页组件

    jQuery EasyUI 数据网格 - 添加分页组件 本实例演示如何从服务器端加载数据,如何添加分页组件(pagination)到数据网格(datagrid). 创建数据网格(DataGrid) 为 ...

  7. 第二百二十八节,jQuery EasyUI,TreeGrid(树形表格)组件

    jQuery EasyUI,TreeGrid(树形表格)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使 ...

  8. jQuery EasyUI/TopJUI创建树形表格下拉框

    jQuery EasyUI/TopJUI创建树形表格下拉框 第一种方法(纯HTML创建) <div class="topjui-row"> <div class= ...

  9. 雷林鹏分享:jQuery EasyUI 树形菜单 - 使用标记创建树形菜单

    jQuery EasyUI 树形菜单 - 使用标记创建树形菜单 一个树形菜单(Tree)可以从标记创建.easyui 树形菜单(Tree)也可以定义在 元素中.无序列表的 元素提供一个基础的树(Tre ...

随机推荐

  1. 寻找复杂背景下物体的轮廓(OpenCV / C++ - Filling holes)

    一.问题提出 这是一个来自"answerOpenCV"(http://answers.opencv.org/question/200422/opencv-c-filling-hol ...

  2. 为什么说 HashMap 是非线程安全的?

    我们在学习 HashMap 的时候,都知道 HashMap 是非线程安全的,同时我们知道 HashTable 是线程安全的,因为里面的方法使用了 synchronized 进行同步. 但是 HashM ...

  3. tomcat部署maven web项目

    tomcat上部署maven web项目的三种方法 1.将maven项目打成war包,然后放到tomcat容器中发布: 2.在IDE工具中部署tomcat,然后使用远程部署方式部署本地maven项目: ...

  4. CSS的再一次深入(更新中···)

    全面我们学了6个选择器,今天再来学习两个选择器,分别是通配符选择器和并集选择器: 1.通配符选择器: *{ } 表示body里所有的标签都被选中 2.并集选择器: 选中的标签之间用逗号隔开,表示这几个 ...

  5. Python3基础 iter+next 进行迭代时超出了范围 产生StopIteration异常

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  6. Android 系统(64)---Android中m、mm、mmm、mma、mmma的区别【转】

    本文转载自:https://blog.csdn.net/zhangbijun1230/article/details/80196379 Android中m.mm.mmm.mma.mmma的区别   m ...

  7. luogu P2486 [SDOI2011]染色

    树剖做法: 就是两个dfs+一个线段树 难度的取决基本==线段树的维护难度 所以对有点线段树基础的,树剖也不难做吧 这里操作有二 一:两点间路径染色 线段树的区间赋值操作 二:查询路径段的个数 考虑线 ...

  8. Activit工作流学习例子

    看了网上一些文章,动手操作了一遍,终于学会了Activit的一些常规使用. 一.Eclipse中的Activiti插件安装 Activiti有一个Eclipse插件,Activiti Eclipse ...

  9. 题解——loj6277 数列分块入门1(分块)

    分块裸题 然后就是记得左右边界处理和分块的初始化 忘了初始化会被卡成暴力 #include <cstdio> #include <algorithm> #include < ...

  10. 题解——洛谷P3275 [SCOI2011]糖果

    一道条件非常多的差分约束 把\( a < b \)转化为\( a-b \le -1\)就可做了 \( a>b \)的情况同理 若有负环则无解输出-1 注意本题中要求每个人都有糖果 所以假设 ...