Ext中gridpanel每行后面可编辑、删除，使用actioncolumn

最新推荐文章于 2021-06-10 02:06:05 发布

原创最新推荐文章于 2021-06-10 02:06:05 发布 · 230 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ext

ExtJs 专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何使用ExtJS中的ActionColumn配置项为Grid添加操作按钮，包括编辑和删除功能，并展示了如何通过点击图标触发相应的事件处理函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如下代码：

var ac = {
xtype: 'actioncolumn',
header: '操作',
width: 50,
items: [{
icon : basePath + '/resources/images/edit.gif', // Use a URL in the icon config
tooltip: '编辑',
handler: function(grid, rowIndex, colIndex) {
var store = Ext.getCmp("mygrid").getStore();
var value = store.getAt(rowIndex);
initStore(storeDept);

//获取编辑window窗口
var windowedit = Ext.getCmp("windowedit");
if(!Ext.value(windowedit)){
editFun(storeDept, value, "");
}
}
},{
icon : basePath + '/resources/images/remove.png', // Use a URL in the icon config
tooltip: '删除',
handler: function(grid, rowIndex, colIndex) {
Ext.MessageBox.confirm("确认",'是否确认删除？',function(btn){
if('yes' == btn){
var store = Ext.getCmp("mygrid").getStore();
var value = store.getAt(rowIndex);
var departmentId = value.get('departmentId');
deleteFun(departmentId);
}
});
}
}
]
};

创建好actioncolumn对象之后，把它添加到columnModel数组中去，即可实现，都试试吧