`

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

    博客分类:
  • Ext
阅读更多

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();

分享到:
评论

相关推荐

    解决Extjs当中复选框全选后,取消选中某一项,全选框仍是选中状态的问题

    EXTJS的`Ext.selection.CheckboxModel`(或简写为`checkboxSelection`)提供了复选框选择模型,用于表格(grid)和其他组件,使得用户可以通过复选框进行多项选择。全选功能通常通过添加一个特殊的复选框来实现,该...

    Ext中grid多行数据全部删除

    本文将详细介绍如何在ExtJS中实现grid多行数据的全部删除功能。 #### 一、理解ExtJS中的Grid组件 在开始之前,我们需要先了解ExtJS中的Grid组件。Grid是ExtJS中最常用的组件之一,用于展示和编辑表格形式的数据。...

    Extjs4 combogrid扩展

    3. **CheckboxModel2.js**:这个文件暗示了可能使用了复选框模型(CheckboxModel),这意味着在grid中可能会有复选框供用户多选。CheckboxModel是ExtJS中的一种行选择模式,允许用户通过勾选复选框来选择表格中的行...

    ExtJS4中文教程2 开发笔记 chm

    Extjs4 带复选框的树(Checkbox tree) Extjs4 新的布局方式 Extjs4 锁定表头(Locking Grid)功能 Extjs4.0 MVC实例 Extjs4.0动态填充combobox数据 Extjs4中up()和down()的用法 ExtJS4学习笔记(一)---window的创建 ...

    ExtJS Grid使用SimpleStore、多选框的方法

    而CheckboxSelectionModel允许用户在Grid中为每行添加一个复选框,实现多选功能。本文将详细介绍如何在ExtJS Grid中结合使用SimpleStore和CheckboxSelectionModel来实现多选框的功能。 首先,我们需要准备数据。...

    Extjs 点击复选框在表格中增加相关信息行

    在Extjs框架中实现点击复选框在表格中增加或删除信息行的功能主要涉及几个方面的知识点,包括表格(Grid Panel)的配置、复选框(CheckboxGroup)的使用、Store的更新以及数据的加载。 首先,要实现复选框控制表格...

    Extjs全选去掉

    2. **CheckboxSelectionModel**:这是Grid组件的一个特殊选择模型,它会在每一行前面添加一个复选框,同时也提供了一个全选复选框在列头,用于全选和全取消选择。 3. **配置选择模型**:在创建Grid时,你可以通过`...

    extjs 4学习

    若要在Grid中添加一个包含复选框的列,你可以定义一个`xtype: 'checkcolumn'`的列配置,例如: ```javascript { header: "&lt;center&gt; 金额小计 &lt;/center&gt;", width: 150, sortable: false, dataIndex: 'checked', ...

    EXTJS教材,教程

    - **自定义能力**:可以生成行号、支持复选框全选、动态选择显示的列、本地和远程分页、单元格自定义渲染、可编辑网格、添加/删除行、脏数据提示、大小调整和行拖拽等。 - **与其他组件交互**:Grid之间以及与Tree...

    extjs插件开发教程

    这个实例可能是关于如何利用插件来改变原有控件的行为,比如创建一个自定义的复选框选择行为,或者对Grid面板进行分组筛选。在实际开发中,可能需要扩展Grid的行选择方式,实现多选或全选等高级功能。 2. **...

    Extjs4 GridPanel 的几种样式使用介绍

    此外,还可以使用`selModel`配置项自定义选择模型的行为,例如启用或禁用复选框选择,或者添加选择事件监听器。 总结,ExtJS4的GridPanel提供了丰富的样式和选择模式,允许开发者根据需求定制表格的外观和交互行为...

    EXTJS4.0视频教程

    - **Checkbox**:复选框组件,用于实现多选功能。 - **Radio Button**:单选按钮组件,用于实现单选功能。 #### 四、代码示例 对于初学者而言,实战编码是非常重要的学习环节。视频教程中提到了“还配有部分的代码...

    ExtJs组件类的对应表

    4. **`checkitem`** - `Ext.menu.CheckItem`,选项菜单项,具有复选框的菜单项。 5. **`menuitem`** - `Ext.menu.Item`,基本菜单项,用于创建简单的菜单项。 6. **`menuseparator`** - `Ext.menu.Separator`,...

    Extjs中文教程

    - 表单组件种类繁多,如文本框、复选框、单选按钮等。 - 每种组件都有其独特的用途和应用场景。 - **表单组件关系图** - 展示了不同表单组件之间的关系及其适用场景。 - 有助于理解和选择合适的组件。 - **...

    ExtJs xtype一览

    - **`menucheckitem` (Ext.menu.CheckItem)**: 选项菜单项组件,提供了一个复选框。 - **`menuitem` (Ext.menu.Item)**: 菜单项组件,用于创建菜单中的单个项目。 - **`menuseparator` (Ext.menu.Separator)**: 菜单...

    汇总Extjs中GridPanel的各个属性与方法.doc.docx

    这是一种特殊的选择模型,允许用户通过复选框选择行。它提供了一种方便的多选方式。 14. **Ext.grid.GridView**: GridView 是 GridPanel 的视图组件,控制着数据的渲染方式。`enableRowBody` 配置项允许包含行的...

    Ext4MVC开发 含treeview 及树单击事件

    Checkbox在ExtJS中常用于复选框选择,这在多选操作中非常常见,如在Grid或TreeView中进行多项选择。这通常涉及到事件处理,例如点击事件,来跟踪用户的选择并执行相应的操作。 Textarea则提供了一个可编辑的文本...

    EXT WebUi标签库使用说明

    - **checkbox**:复选框,用于多选功能,常用于表单数据收集。 - **checkBoxGroup**:一组复选框,便于管理多个复选框的选中状态。 - **select**:下拉框,支持编辑和智能填充,提升用户体验。 - **dateEdit**:...

Global site tag (gtag.js) - Google Analytics