extjs grid
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = '../resources/images/default/s.gif';
Ext.QuickTips.init();
function formatDate(value) {
//var date = new Date(value);
return value ? date.dateFormat('Y-m-d H:i:s') : '';
}
var sm = new Ext.grid.CheckboxSelectionModel({checkOnly : true});
var cm = new Ext.grid.ColumnModel([sm, {
id : 'ID',
header : '编号',
dataIndex : 'ID',
align : 'center',
width : ,
hidden : true
}, {
header : '名称',
dataIndex : 'name',
align : 'center',
width : ,
editor : new Ext.form.TextField({})
}, {
header : "时间",
dataIndex : 'time',
width : ,
align : 'center',
renderer : formatDate,
editor : new Ext.ux.form.DateTimeField({
fieldLabel : '时间',
id : 'time',
name : 'time',
width : ,
height : ,
allowBlank : false,
blankText : '时间不能为空',
editable : false,
value : new Date()
})
}]);
var record = Ext.data.Record.create([{
name : 'ID',
type : 'string'
}, {
name : 'name',
type : 'string'
}, {
name : 'time',
type : 'date',
dateFormat : 'Y-m-d H:i:s'
}]);
var store = new Ext.data.Store({
autoLoad : false,
pruneModifiedRecords : true, //每次Store加载后,清除所有修改过的记录信息
proxy : new Ext.data.HttpProxy({
url : 'list.action',
method : 'POST'
}),
baseParams : {
pageNo : ,
pageSize :
},
paramNames : {
start : "pageNo",
limit : "pageSize"
},
reader : new Ext.data.JsonReader({
totalProperty : 'totalCount',
root : 'results'
}, record)
});
store.load();
var tbar = new Ext.Toolbar({
items : [{
text : '新增',
iconCls : 'add',
handler : add
}, '-', {
text : '保存',
iconCls : 'save',
handler : save
}, '-', {
text : '删除',
iconCls : 'remove',
handler : remove
}]
});
var bbar = new Ext.PagingToolbar({
pageSize : ,
store : store,
displayInfo : true,
lastText : "尾页",
nextText : "下一页",
beforePageText : "当前",
prevText : "上一页",
firstText : "首页",
refreshText : "刷新",
afterPageText : "页,共{0}页",
displayMsg : '数据从第{0}条 - 第{1}条 共{2}条数据',
emptyMsg : '没有数据'
});
var grid = new Ext.grid.EditorGridPanel({
id : "myGrid",
title : '信息维护',
renderTo : 'grid',
sm : sm,
cm : cm,
store : store,
clicksToEdit : ,
loadMask : {
msg : '正在加载数据,请稍侯……'
},
autoScroll : true,
autoWidth : true,
autoHeight : true,
stripeRows : true,
viewConfig : {
forceFit : true
},
tbar : tbar,
bbar : bbar
});
grid.render();
function add() {
var initValue = {
ID : "",
name : "",
time : new Date()
};
var recode = store.recordType;
var p = new recode(initValue); // 根据上面创建的recode 创建一个默认值
grid.stopEditing();
store.insert(, p);// 在第一个位置插入
grid.startEditing(, );// 指定的行/列,进行单元格内容的编辑
}
function save() {
var modified = store.modified;
Ext.Msg.confirm("警告", "确定要保存吗?", function(button) {
if (button == "yes") {
var json = [];
Ext.each(modified, function(item) {
json.push(item.data);
});
if (json.length > ) {
Ext.Ajax.request({
url : "save.action",
params : {
data : Ext.util.JSON.encode(json)
},
method : "POST",
success : function(response) {
Ext.Msg.alert("信息","数据保存成功!",function() {
store.reload();
});
},
failure : function(response) {
Ext.Msg.alert("警告","数据保存失败,请稍后再试!");
}
});
} else {
Ext.Msg.alert("警告", "没有任何需要更新的数据!");
}
}
});
}
function remove() {
var selModel = grid.getSelectionModel();
if (selModel.hasSelection()) {
Ext.Msg.confirm("警告", "确定要删除吗?", function(button) {
if (button == "yes") {
var recs = selModel.getSelections();
var list = [];
for (var i = ; i < recs.length; i++) {
var rec = recs[i];
list.push("'" + rec.get('ID') + "'");
}
Ext.Ajax.request({
url : "delete.action",
params : {
data : list.join(',')
},
method : "POST",
success : function(response) {
Ext.Msg.alert("信息","数据删除成功!", function() {
store.reload();
});
},
failure : function(response) {
Ext.Msg.alert("警告","数据删除失败,请稍后再试!");
}
});
}
});
} else {
Ext.Msg.alert("错误", "没有任何行被选中,无法进行删除操作!");
}
}
});
public String list() throws Exception {
String sql = "select ID,name,time from Info";
String rs= infoService.getJSONBySQL(sql, page);
String jsonString = "{totalCount:" + page.getTotal() + ",results:" + rs+ "}";
response.setCharacterEncoding("UTF-8");
response.setContentType("application/json");
response.getWriter().print(jsonString);
return null;
}
public String save() throws Exception {
String data = request.getParameter("data");
JSONArray array = JSONArray.fromObject(data);
Object[] list = array.toArray();
for (int i = ; i < list.length; i++) {
Map<String, String> map = (Map<String, String>) list[i];
Info info = new Info();
info.setId(map.get("ID"));
info.setName(map.get("name"));
info.setTime(map.get("time"));
if (null != info.getId() && info.getId().length() > ) {
infoService.upate(info);
} else {
infoService.save(info);
}
}
response.getWriter().write("SUCCESS");
return null;
}
public String delete() throws Exception {
String ids = request.getParameter("data");
infoService.delete(ids);
response.getWriter().write("SUCCESS");
return null;
}
extjs grid的更多相关文章
- ExtJS Grid导出excel文件
ExtJS Grid导出excel文件, 需下载POI:链接:http://pan.baidu.com/s/1i3lkPhF 密码:rqbg 1.将Grid表格数据连同表格列名传到后台 2.后台导出e ...
- extjs grid renderer用法
extjs grid renderer用法 摘自:http://www.cnblogs.com/ljian/archive/2011/10/27/2226959.html var cm = new E ...
- 解决extjs grid 不随窗口大小自适应的问题
解决extjs grid 不随窗口大小自适应的问题 August 30, 2010 zhai Javascript 8,403 viewsGo to comment 最近遇到的问题,在使用grid的时 ...
- Extjs grid分页多选记忆功能
很多同事在用extjs grid做分页的时候,往往会想用grid的多选功能来实现导出Excel之类的功能(也就是所谓的多选记忆功能),但在选选择下一页的时候 上一页选中的已经清除 这是因为做分页的时候 ...
- extjs grid数据改变后刷新的实现
做了一个编辑extjs grid记录的窗体,但更改数据后,怎么重新刷新grid让数据显示呢? 做了半天的尝试,其实到最后只需一句话,faint:-) this.store.reload(); 不用加任 ...
- 72. js EXTJS grid renderer用法
转自:https://blog.csdn.net/shancunxiaoyazhi/article/details/22156083 renderer : Function (可选的)该函数用于加工单 ...
- [转]ExtJS Grid 分页时保持选中的简单实现方法
原文地址 :http://www.qeefee.com/article/ext-grid-keep-paging-selection ExtJS中经常要用到分页和选择,但是当选择遇到分页的时候,杯具就 ...
- ExtJs Grid 删除,编辑,查看详细等超链接处理
在网上查了好多资料,关于ExtJs处理操作栏的“删除”.“编辑”.“查看详细”的处理,原来项目都是这么处理: 操作栏:{ text:'操作', xtype:'actioncolumn', items ...
- extjs grid 分页
在使用extjs创建带分页功能的 grid 如下: 1.创建一个模型 // 创建算定义模型 模型名称 User Ext.define('User', { extend: 'Ext.data.Model ...
- extjs grid renderer用法【转载】
今天在做项目时,需要在列表中的某列添加一个超链接,首先要取得当前选中行的数据,判断数据类型,然后链接到不同的页面,研究下.发现ExtJs提供了一个很强的方法如下: var cm = new Ext.g ...
随机推荐
- 暑假热身 A. GCC
GCC编译器是一个由GNU项目维护的编译系统,它支持多种编程语言的编译.但是它并不包含数学运算符“!”.在数学中,这个符号代表阶乘.表达式n!的意思是从1到n的所有整数的乘积. 例如,4!=4*3*2 ...
- HDU3344(小广搜+小暴力
Kakuro Extension Extension Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Ja ...
- Linux init进程详解
init模块 一般来说,Linux程序只能用另一个Linux程序启动.例如,登录Linux终端程序Mingetty. 但终端程序又由谁启动呢?在计算机上启动Linux时,内核装入并启动init程序. ...
- 【云计算】实战-五个Docker监控工具的对比
[实战]五个Docker监控工具的对比 阅读目录 Docker Stats命令 CAdvisor Scout Data Dog Sensu Monitoring Framework 总结 这篇文章作者 ...
- iOS 关于UITableView的dequeueReusableCellWithIdentifier
今天看代码的时候,突然想到了以前的一个问题. 刚学ios那会儿,常会写出以下代码 - (UITableViewCell *)tableView:(UITableView *)tableView cel ...
- ACdream 1188 Read Phone Number (字符串大模拟)
Read Phone Number Time Limit:1000MS Memory Limit:64000KB 64bit IO Format:%lld & %llu Sub ...
- Xshell 中文乱码
Xshell对于嵌入式开发来说,是个非常不错的工具.但或许都有过被中文显示为乱码的问题感觉有点不爽.解决方法其实很简单的,即把xshell编码方式改成UTF-8即可. [文件]–>[打开]–&g ...
- typedef用法
参考文章:http://www.cnblogs.com/shenlian/archive/2011/05/21/2053149.html
- DB2修改表字段
1:删除字段非空属性 alter table XXX alter column XXX drop not null 此特性需要DB2 9.0以上的版本 2:添加字段非空属性alter table XX ...
- struts2文件上传类型的过滤
转自:http://www.2cto.com/kf/201403/282787.html 第一种解决方案: 1.手动实现文件过滤: 判断上传的文件是否在允许的范围内定义该Action允许上传的文件类型 ...