ext:grid分页,列宽度自动填满grid宽度
var cm = new Ext.grid.ColumnModel([{
header : '编号',
dataIndex : 'id'
}, {
header : '名称',
dataIndex : 'name'
}, {
header : '描述',
dataIndex : 'descn'
}]);
var store = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({
url : 'data.jsp'
}),
reader : new Ext.data.JsonReader({
totalProperty : 'totalProperty',
root : 'root'
}, [{
name : 'id'
}, {
name : 'name'
}, {
name : 'descn'
}])
});
store.load({
params : {
start : 0,
limit : 20
}
});
var grid = new Ext.grid.GridPanel({
renderTo : Ext.getBody(),
ds : store,
cm : cm,
autoHeight : true, //这样grid才能全部显示行,不用滚动
viewConfig : {
forceFit : true //让grid的列自动填满grid的整个宽度,不用一列一列的设定宽度。
},
bbar : new Ext.PagingToolbar({
pageSize : 20,
store : store,
displayInfo : true,
displayMsg : '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
emptyMsg : "没有记录"
})
});
还有一个属性,设置表格中某一列的宽度自适应,填充grid剩余的宽度。
cm中要设置id:
var cm = new Ext.grid.ColumnModel([{
header : '编号',
dataIndex : 'id'
}, {
header : '名称',
dataIndex : 'name'
}, {
id : 'description',
header : '描述',
dataIndex : 'descn'
}]);
然后在grid的初始配置中加上:
autoExpandColumn : 'description', //先在cm中给列加上id,然后设置grid要自动适应的列的id
jsp代码:
<%
String start = request.getParameter("start");
String limit = request.getParameter("limit");
try {
int index = Integer.parseInt(start);
int pageSize = Integer.parseInt(limit);
String json = "{totalProperty:100,root:[";
for (int i = index; i < pageSize + index; i++) {
json += "{id:" + i + ",name:'name" + i + "',descn:'descn"
+ i + "'}";
if (i != pageSize + index - 1) {
json += ",";
}
}
json += "]}";
response.getWriter().write(json);
} catch (Exception ex) {
}
%>
ext:grid分页,列宽度自动填满grid宽度的更多相关文章
- [WP8] ListBox的Item宽度自动填满
[WP8] ListBox的Item宽度自动填满 范例下载 范例程序代码:点此下载 问题情景 开发WP8应用程序的时候,常常会需要使用ListBox作为容器来呈现各种数据集合.但是在ListBox呈现 ...
- css布局------左边宽度不定,右边宽度自动填满剩余空间
HTML <div class="container"> <div class="left"></div> <div ...
- li 水平排列并自动填满 ul
找了li 如何水平排列并自动填满 ul,同时 li 宽度平均?资料,里面有提到"请用js动态计算保证兼容性", 因为我想实现的是,水平滚动条,ul的上级div是固定的宽度1000p ...
- 两个DIV,左DIV宽度固定,右DIV自动填满剩余空间
<style type="text/css"> #main{ width:98%; } #sidebar{ float:left; width:200px; backg ...
- -webkit-box 高度自动填满
<style> .box{ display: -webkit-box; -webkit-box-orient: vertical; height: 200px; background: # ...
- 手机H5,用Jquery使图片自动填满两栏式排版
遇上这样的排版,手机的解象度都不同,假如只用CSS3根本就做不出这样的排版:因此要用Jquery. 1. HTML <div class="postImgCenterCrop" ...
- datagridview随窗体的大小而变,表格填满控件
在C#winform布局的时候,我们拖一个datagridview到窗体上面,将datagridview调整为适合窗体的大小,但是我们运行之后,点击最大化按钮的时候,却发现datagridview的大 ...
- Ext4.1 Grid 分页查询
转载:http://blog.csdn.net/zyujie/article/details/16362747 最近用Ext4.1自己做了做项目的练习:把一些知识点,在这里记录下来了! 上面一个for ...
- LigerUi中为Grid表加上序号,并调整适当宽度!(实例)
LigerUi中为Grid表加上序号,并调整适当宽度!(实例) dataAction: 'server', pageSize: 20, toolbar: {}, url: 'ndl ...
随机推荐
- Ural Sport Programming Championship 2015
Ural Sport Programming Championship 2015 A - The First Day at School 题目描述:给出课程安排,打印一个课程表. solution 暴 ...
- js固定小数位数 .toFixed()
toFixed(num)法可把 Number 四舍五入为指定小数位数的数字. num为需要固定的位数 var num=2;console.log(num.toFixed(2));//2.00;var ...
- 微信开发,调用js-SDK接口
微信开发,调用js-SDK接口<!DOCTYPE html><html><head lang="en"> <meta charset=&q ...
- 浅谈Java中的hashcode方法(转)
原文链接:http://www.cnblogs.com/dolphin0520/p/3681042.html 浅谈Java中的hashcode方法 哈希表这个数据结构想必大多数人都不陌生,而且在很多地 ...
- P3960 列队
这是NOIP 2017最后一道题 不知道这道题有没有人代码写的和我一样麻烦. Solution 30分暴力 维护每行每列的元素. 每次删除一个元素的时候, 需要修改一行一列 因此复杂度上界\(O(nm ...
- 20165301 2017-2018-2 《Java程序设计》第六周学习总结
20165301 2017-2018-2 <Java程序设计>第六周学习总结 教材学习内容总结 第七章:常用实类 String类 构造String对象 常量对象 String对象 Stri ...
- Next Permutation——简单、经典
Implement next permutation, which rearranges numbers into the lexicographically next greater permuta ...
- 用JDK自带的监控工具jconsole来监控程序运行
工具目录:C:\Program Files\Java\jdk1.6.0_06\bin\jconsole.exe 效果如下:监控类ThreadPoolExecutorTest 的运行 选择我们运行的程序 ...
- Hadoop(七)YARN的资源调度
一.YARN 概述 YARN 是一个资源调度平台,负责为运算程序提供服务器运算资源,相当于一个分布式的操 作系统平台,而 MapReduce 等运算程序则相当于运行于操作系统之上的应用程序 YARN ...
- 快速开发window服务器程序
import service; service.startDispatchThread( 服务名 = function(serviceName,argv){ import service; var s ...