转自:https://blog.csdn.net/qq_29663071/article/details/50728429
本文导读:Ext.grid.GridPanel继承自Panel,其xtype为grid,包括了排序、缓存、拖动、隐藏某一列、自动显示行号、列汇总、单元格编辑等实用功能。 当我们需要获取选择的数据时,就需要用到getSelectionModel方法。下面介绍GridPanel中getSelectionModel的操作。

一、Ext.grid.GridPanel

主要配置项:

store:表格的数据集
columns:表格列模式的配置数组,可自动创建ColumnModel列模式
autoExpandColumn:自动充满表格未用空间的列,参数为列id,该id不能为0
stripeRows:表格是否隔行换色,默认为false
cm、colModel:表格的列模式,渲染表格时必须设置该配置项
sm、selModel:表格的选择模式,默认为Ext.grid.RowSelectionModel
enableHdMenu:是否显示表头的上下文菜单,默认为true
enableColumnHide:是否允许通过标题中的上下文菜单隐藏列,默认为true

loadMask:是否在加载数据时显示遮罩效果,默认为false
view:表格视图,默认为Ext.grid.GridView
viewConfig:表格视图的配置对象
autoExpandMax:自动扩充列的最大宽度,默认为1000
autoExpandMin:自动扩充列的最小宽度,默认为50
columnLines:是否显示列分割线,默认为false
disableSelection:是否禁止行选择,默认为false

enableColumnMove:是否允许拖放列,默认为true
enableColumnResize:是否允许改变列宽,默认为true
hideHeaders:是否隐藏表头,默认为false
maxHeight:最大高度
minColumnWidth:最小列宽,默认为25
trackMouseOver:是否高亮显示鼠标所在的行,默认为true

主要方法:

getColumnModel():取得列模式
getSelectionModel():取得选择模式
getStore():取得数据集
getView():取得视图对象
reconfigure( Ext.data.Store store, Ext.grid.ColumnModel colModel ):使用一个新的数据集和列模式重新配置表格组件

二、getSelectionModel获取选择的行可以进行如下操作

JScript 代码   复制

var model = grid.getSelectionModel();
model.selectAll();//选择所有行  model.selectFirstRow();//选择第一行  model.selectLastRow([flag]);//选择最后一行,flag为正的话保持当前已经选中的行数,不填则默认false  model.selectNext();//选择下一行  model.selectPrevious();//选择上一行  model.selectRange(tartRow,ndRow, [Boolean keepExisting] );//选择范围间的行  model.selectRow(row);//选择某一行  model.selectRows(rows);//选择指定一些行,传递数组如[1,3,5],则分别选择1,3,5行  model.clearSelections();//清空所有选择  model.deselectRange( startRow, endRow );//取消从startrow到endrow的记录的选择状态  model.deselectRow(row);//取消指定行的记录 grid.getSelected().id //得到选中的行的标识  var getSelect=function (grid, col) { //获取选中grid的列  var st=""; for (var i = 0; i < grid.getSelectionModel().getSelections().length; i++) { st+=grid.getSelectionModel().getSelections()[i].get("'"+col+"'")+","; } }

grid.getSelectionModel的所有操作

1. var model = grid.getSelectionModel();  
   2. model.selectAll();//选择所有行  
   3. model.selectFirstRow();//选择第一行  
   4. model.selectLastRow([flag]);//选择最后一行,flag为正的话保持当前已经选中的行数,不填则默认false  
   5. model.selectNext();//选择下一行  
   6. model.selectPrevious();//选择上一行  
   7. model.selectRange(tartRow,ndRow, [Boolean keepExisting] );//选择范围间的行  
   8. model.selectRow(row);//选择某一行  
   9. model.selectRows(rows);//选择指定一些行,传递数组如[1,3,5],则分别选择1,3,5行  
  10.   
  11.   
  12. model.clearSelections();//清空所有选择  
  13. model.deselectRange( startRow, endRow );//取消从startrow到endrow的记录的选择状态

14. model.deselectRow(row);//取消指定行的记录

extjs获取Grid中某一行某一列的值

选中某一行,var record = grid.getSelectionModel().getSelection();
一行的所有数据都在record里面
具体某一列:record.get("列名-dataIndex")

extjs获取store的值

grid.getStore().each(function(record){
var value = record.get("field_name");
});
store 中each()方法的使用应在load完使用,确切的说应该在on('load')事件中使用,
不懂就看一下下面的例子吧!。。。

  1. //获得store,这里假如store里有3条记录。
  2. var i = 0;
  3. var ds = grid.getStore();
  4. \\
  5. //以下是正确与不正确的例子
  6. 1)错误例子
  7. ds.each(function(rec)
  8. { i++; }
  9. );
  10. result : i = 0;//表明each没有执行或此方法在数据加载前执行(后者的可能行更大)
  11. 2)正确例子
  12. ds.on('load',function(store,records){
  13. store.each(function(rec)
  14. { i++; }
  15. );
  16. });
  17. result: i = 3;
  18. 下面看一下如何使grid中的checkBox为选中状态
  19. var sm = grid.getSelectionModel();//get the seletion model
  20. ds.on('load',function(store,records){
  21. store.each(function(rec) {
  22. //判断条件
  23. if(....)
  24. { sm.selectRecords([rec]); }
  25. );
  26. });

转载于:https://www.cnblogs.com/sharpest/p/7639482.html

55. GridPanel中getSelectionModel详解相关推荐

  1. 函数中{}输出格式详解(C#)

    Console.WriteLine()函数中{}输出格式详解(C#) Console.WriteLine()函数的格式一直没怎么注意.今天同事问起Console.WriteLine({0:D3},a) ...

  2. oracle中to_date详解

    oracle中to_date详解 TO_DATE格式(以时间:2007-11-02 13:45:25为例) 1. 日期和字符转换函数用法(to_date,to_char) 代码如下: select t ...

  3. Java中CAS详解

    转载自  Java中CAS详解 在JDK 5之前Java语言是靠synchronized关键字保证同步的,这会导致有锁 锁机制存在以下问题: (1)在多线程竞争下,加锁.释放锁会导致比较多的上下文切换 ...

  4. 【转】图形流水线中坐标变换详解:模型矩阵、视角矩阵、投影矩阵

    转自:图形流水线中坐标变换详解:模型矩阵.视角矩阵.投影矩阵_sherlockreal的博客-CSDN博客_视角矩阵 图形流水线中坐标变换详解:模型矩阵.视角矩阵.投影矩阵 图形流水线中坐标变换过程 ...

  5. oracle itl解析,oracle数据块dump文件中ITL详解

    oracle数据块dump文件中ITL详解 dump出Oracle block后,可以看到事物槽,包含有事物槽号(ITL),XID,UBA,FLAG,LCK,SCN. 本文主要讨论FLAG标记的规则, ...

  6. android中getSystemService详解

    原文地址:android中getSystemService详解作者:邹斌 http://blog.sina.com.cn/s/blog_71d1e4fc0100o8qr.html http://blo ...

  7. Oracle中CONCAT详解

    Oracle中CONCAT详解 1.什么是CONCAT 新的改变 我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写 ...

  8. Java中LinkedList详解

    Java中LinkedList详解 LinkedList底层是双向链表 单向链表 双向链表 LinkedList新增的方法 主要增加了针对头结点与尾结点进行操作的方法, 即针对第一个元素和最后一个元素 ...

  9. vue 生命周期的11中方法详解

    vue 生命周期的十一中方法详解 vue 生命周期的定义 vue实例 从创建到销毁,也就是说从创建 -> 初始化 数据-> 编译模版 -> 挂载Dom -> 渲染 更新 -&g ...

  10. oracle语句中dual什么意思,oracle中dual详解

    oracle中dual详解 基本上oracle引入dual为的就是符合语法 1. 我们先从名称来说,dual不是缩写词,本身就是完整的单词.dual名词意思是对数,做形容词时是指二重的,二元的. 2. ...

最新文章

  1. 百亿级数据分表后怎么分页查询?
  2. ubuntu相关命令
  3. 2018python好找工作吗-2018年为什么要学习Python?Python还有前景吗?
  4. Android Studio通过JNI调用NDK程序
  5. P4568 [JLOI2011]飞行路线 P2939 [USACO09FEB]改造路Revamping Trails
  6. 我从吴恩达AI For Everyone中学到的十个重要AI观
  7. (转)《AS3 Expert》动态语言的基石:函数闭包
  8. jenkins war包_Jenkins的安装和部署(jenkins教程)
  9. POJ 1852 Ants 分析
  10. 美国科学家研制出由病毒构成的微型电池
  11. 用于UML前端展示的jsuml2插件
  12. 微信小程序模板消息推送
  13. Hotspot 偏向锁BiasedLocking 源码解析
  14. 小程序30分钟倒计时
  15. 重置网络命令win7
  16. Android 百度离线地图下载完后调用下载好的离线包
  17. dede标签调用大全
  18. Unity用户手册2019.3(中文版)1.3.1 常见资源类型
  19. springboo集成bboss-elasticsearch实现elasticsearch客户端
  20. Apache安装与基本配置

热门文章

  1. 如何用C#代码判断一个类的类型
  2. 使用Reflexil修改类库
  3. 关于时间、日期的一些应用
  4. 【Vegas原创】ctrl shift无法切换输入法的解决方法
  5. 2016021902 - linux解压缩命令
  6. ganglia集群监控搭建步骤
  7. 263. Ugly Number
  8. 【沫沫金】Sql子查询Not In 无结果原因
  9. Go Get设置代理
  10. hadoop 开发环境设置以及可运行jar包生成