ext grid 加入checkbox列

grid每列前面加checkbox:
一般的grid使用一个Ext.grid.ColumnModel就可以了,要加入一个多选的列,[b]一种方法是加入一个多选列模板Ext.grid.CheckboxSelectionModel:[/b]
var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel(
[
sm,
{id:'company',header: "Company", width: 60, sortable: true, dataIndex: 'company'},
]
);
另外,实例化EditorGridPanel时还必须指定这个sm为selModel.
如果不指定EditorGridPanel的selModel,将无法勾选checkbox。
grid = new Ext.grid.EditorGridPanel(
{
id:'editGridTestAjax',
width:700,
height:500,
el:'topic-grid',
store:ds,
cm:cm,
clickToEdit:2,//双击后进入编辑状态
selModel:sm //这个 selModel 可简写为sm
}
);

//处理checkbox的勾选事件
grid.getSelectionModel().on('rowselect', function(sm, rowIdx, r){
alert('勾选了checkbox后,获得选中行的name:'+grid.store.getAt(rowIdx).get('name'));
});
//处理checkbox的取消勾选事件
grid.getSelectionModel().on('rowdeselect', function(sm, rowIdx, r){
alert('取消勾选checkbox后,获得的record 中的name:'+grid.store.getAt(rowIdx).get('name'));
});

[b]另一种方法是在ColumnModel中自己写一个checkbox列[/b]
function changeCheck(value,cellmeta,record,rowIndex,columnIndex,store){
return "<input type='checkbox' name='adds_checkbox' οnclick=oneclick(this) id='adds_checkbox_'"+value+"></input>";
}
//上面的oneclick方法定义在Ext.onReady()外面
var cm = new Ext.grid.ColumnModel(
[

{//自定义的多选列
header:"<input id='allcheckbox' type='checkbox' οnclick=checkall(this)></input>",
dataIndex:'addsid',
renderer:changeCheck,
width:20,
sortable:false
},
...
]
);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值