数据表格 - DataGrid - 列表显示
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<%
String homePage = request.getContextPath();
%>
<script type="text/javascript">
$(function () {
$("#datagrid").datagrid({
url: "<%=homePage%>/testController/datagrid.ajax?type=list",
title: "标题",
iconCls: "icon-save",
pagination: true,
pageSize: 10,
pageList: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100],
fit: true,
fitColumns: true,//列少的时候,设置为true比较合适
nowrap: false,//false - 单元格数据多的时候进行折行 true - 不管数据有多少,都在一行显示
border: false,
idField: "id",
columns: [
[
{field: "id", title: "编号", width: 100}
, {field: "name", title: "姓名", width: 100}
, {field: "password", title: "密码", width: 100}
]
]
});
})
</script> <div class="easyui-tabs" fit="true" border="false">
<div title="用户管理">
<table id="datagrid"></table>
</div>
</div>

后端
@RequestMapping(value = "/datagrid.ajax", params = "type=list")
@ResponseBody
public Map<String, Object> datagrid1(@RequestParam Map<String, String> map) {
logger.debug("参数:" + map);
Map<String, Object> map1 = new HashMap<>();
List<Map<String, String>> list = new ArrayList<>();
for (int i = 0; i < 100; i++) {
Map<String, String> map2 = new HashMap<>();
list.add(map2);
map2.put("id", i + "");
map2.put("name", "姓名" + i);
map2.put("password", "密码" + i);
}
map1.put("rows", list);
map1.put("total", 100);
return map1;
} 因为设置了分页,每次查询的时候,都会把page和rows参数传递给后台,后台拿着这个参数,进行分页查询后,将结果集存在rows中,把总条数存在total中。 这就实现了一个简单的分页列表了,以为还没有查询条件,还不能叫做分页查询
数据表格 - DataGrid - 列表显示的更多相关文章
- easyUI 数据表格datagrid的使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- [转载]EasyUI中数据表格DataGrid添加排序功能
我们这里演示的是EasyUI数据表格DataGrid从服务器端排序功能,因为觉的本地数据排序没有多大的作用,一般我们DataGrid不会读取全部数据,只会读取当前页的数据,所以本地数据排序也只是对当前 ...
- 数据表格 - DataGrid - 查询
toolbar头部工具栏 <script type="text/javascript"> $(function () { $("#datagrid" ...
- jquery easy ui 1.3.4 数据表格(DataGrid)(8)
8.1.创建DataGrid html代码 <table id="dg"></table> $("#dg").datagrid({ // ...
- easyui框架--基础篇(一)-->数据表格datagrid(php与mysql交互)
前 言 php easyui框架--本篇学习主要是 easyui中的datagrid(数据表格)框架. 本篇学习主要通过讲解一段代码加GIF图片学习datagrid(数据表格)中的一些常用属 ...
- 数据表格datagrid内容整理
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- easyUI数据表格datagrid之笔记2
/**========================================= * 追加在表格尾部 */function append(){ editIndex = $('#dg').dat ...
- 数据表格 - DataGrid - 行编辑
行编辑一般用于单行数据的增删改,如果不用行编辑实现的话,对于表单数据量不大的情况,可以使用弹窗(Dialog),如果数据量比较大,也就是需要操作的数据比较多的时候,可以新开一个tab页. 新增/编辑 ...
- 数据表格 - DataGrid - 字段排序
设置默认排序字段 sortName:"id",sortOrder:"desc",单独为每个字段设置排序 {field: "name", ti ...
随机推荐
- iOS开发之 用第三方类库实现轮播图
在github上面有很多的第三方类库,大大节约了大家的开发时间 下载地址:https://github.com/gsdios/SDCycleScrollView 现已支持cocoapods导入:pod ...
- C++语言-05-三大特性
概述 C++ 是面向对象的语言,具备 OOP 的基本特性. 封装 概念 将数据和操作数据的函数绑定在一起 作用 避免受到外界的干扰和误用,确保了安全 与封装相关的概念 数据抽象 仅向用户暴露接口而把具 ...
- python 获取星期几
In [17]: now.strftime(%a),now.strftime(%w) Out[17]: ('Mon', '1') Directive Meaning %a Weekday name. ...
- python 判断学期与学年
9,10,11,12,1 第一学期 2,3,4,5,6,7 第二学期 其中8月份放假,暂且放入第一学期.因为大部分学校都选在8月底开学 import datetime def getXNandXQ() ...
- JAVA同步容器和并发容器
同步容器类 同步容器类的创建 在早期的JDK中,有两种现成的实现,Vector和Hashtable,可以直接new对象获取: 在JDK1.2中,引入了同步封装类,可以由Collections.sync ...
- C# 获取 新浪微博登录之后的 完整的Cookie
程序说明: 1.此项目 包含两个项目, 一个 Winform WinGetMocroblogCookie 用于手动 登录 新浪微博 其中涉及到的技术有: 使用webbrowser 获取HttpOnly ...
- c# 注册全局热键
//引入系统API [DllImport("user32.dll")] static extern bool RegisterHotKey(IntPtr hWnd, int id, ...
- Java api 入门教程 之 JAVA的Date类与Calendar类
在JDK1.0中,Date类是唯一的一个代表时间的类,但是由于Date类不便于实现国际化,所以从JDK1.1版本开始,推荐使用Calendar类进行时间和日期处理. 一.这里简单介绍一下Date类的使 ...
- 高性能MySQL笔记 第4章 Schema与数据类型优化
4.1 选择优化的数据类型 通用原则 更小的通常更好 前提是要确保没有低估需要存储的值范围:因为它占用更少的磁盘.内存.CPU缓存,并且处理时需要的CPU周期也更少. 简单就好 简 ...
- android-xxxx must implement the inherited abstract method报错
public class ContactMainFragment extends Fragment implements OnClickListener { 提示:ContactMainFragmen ...