extjs4 grid 多选、添加复选框、动态添加删除数据

最新推荐文章于 2023-03-19 19:34:51 发布

原创最新推荐文章于 2023-03-19 19:34:51 发布 · 2.1k 阅读

CC 4.0 BY-SA版权

本文介绍了如何在ExtJS4的Grid中实现多选功能，通过设置multiSelect: true属性实现。同时，讲解了如何添加复选框，通过创建CheckboxModel并设置为Grid的selModel。此外，还展示了动态添加和删除数据的方法，使用store.insert()插入数据，store.remove()移除数据。示例代码中提供了具体的实现过程，包括在用户选择记录后，将选中记录从一个Grid添加到另一个Grid，并从原始Grid中删除。完整示例可在提供的链接查看。

grid多选属性：multiSelect: true添加复选框：首先定义var selectModel = Ext.create(‘Ext.selection.CheckboxModel’); 然后设置grid的selModel属性。动态添加删除数据：store.insert();和store.remove();//示例代码：var arows = Ext.getCmp('dailytestuffASG').getSelectionModel().getSelection();var orows = Ext.getCmp('dailytestuffOSG').getSelectionModel().getSelection();if(orows.length==0){Ext.Msg.alert('错误','请选择要添加的记录！');return;}var flag = false;for(var i=0;i<orows.length;i++){if(arows.length>0){for(var j=0;j<arows.length;j++){ if(orows[i].get('userId')==arows[j].get('userId')){ flag = true; break; }}if(flag==true){ flag==false; continue;}}var data = [{'userId': orows[i].get('userId'), 'userName': orows[i].get('userName'), 'depart': orows[i].get('depart')}];dailytestuffASGStore.insert(0,data);}Ext.each(orows,function(orows){dailytestuffOSGStore.remove(orows);});dailyASGModel.selectAll();

详细页面：http://www.verydemo.com/demo_c113_i10317.html