extjs Grid 时,默认初始选中
来源:互联网 发布:爱青岛软件 编辑:程序博客网 时间:2024/06/02 22:49
最近在使用带复选框grid 组件的时候发现了一个奇怪的问题,第一次载入这个grid 组件时就给这个grid 组件初始化数据并选中其中的某一项,但始终无法选中,经单步调试发现,选中行的方法已被执行了,只是在所有的东西都执行完后,grid 又刷新了一下,导致原先选中的项丢失。
代码如下:
Js代码
Ext .onReady(function(){
var data = [
['table1','column1','remark1'],
['table2','column2','remark2']
];
var store = new Ext .data.Store({
proxy : new Ext .data.MemoryProxy(data),
reader : new Ext .data.ArrayReader({},[
{name : 'tableName'},
{name : 'columnName'},
{name : 'remark'}
])
});
var databindsm = new Ext .grid .CheckboxSelectionModel({handleMouseDown :Ext .emptyFn,singleSelect : true});
var cm = new Ext .grid .ColumnModel([
new Ext .grid .RowNumberer(),
databindsm,
{header : '表名',dataIndex : 'tableName',width : 145},
{header : '字段名',dataIndex : 'columnName',width : 145},
{header : '备注',dataIndex : 'remark',width : 145}
]);
var grid = new Ext .grid .GridPanel({
width : 570,
height : 240,
loadMark : true,
store : store,
cm : cm,
sm : databindsm
});
var viewport = new Ext .Viewport({
height : 240,
width : 570,
items : [grid ]
});
store.load(data);
alert("aa");
grid .getSelectionModel().selectRow(1,true);
alert("bb");
});
经查发现,原来是ext 的mvc模式在作怪,源码中有如下方法:
Js代码
// private
afterRender : function(){
Ext .grid .GridPanel.superclass.afterRender.call(this);
this.view.layout();
if(this.deferRowRender){
this.view.afterRender.defer(10, this.view);
}else{
this.view.afterRender();
}
this.viewReady = true;
},
在render数据后并没有显示页面,而是延迟渲染view,我们在view后再去选中,虽然设置了选中,但被延迟的渲染覆盖掉了,所以导致逻辑正确而显示不正确的结果。
解决办法:
1、静态store:在grid 中加上一个配置项 deferRowRender:false(不执行默认的render代码);
2、动态store:使用store的load事件,在装载后进行选中
Js代码
grid .store.on("load",function(){
grid .getSelectionModel().selectRow(1,true);
});
From : http://kakarot-java.javaeye.com/blog/504345
- extjs Grid 时,默认初始选中
- extjs Grid 时,默认初始选中
- extjs Grid 时,默认初始选中,解决默认选不中的问题
- Extjs Grid中默认选中
- extjs grid默认选中第一行
- extjs grid的Ext.grid.CheckboxSelectionModel默认选中解决方法
- Grid初始选中问题
- Extjs 4 grid中的checkbox的加载时预选中【默认选中】
- grid 默认选中一行
- ExtJS Grid获取选中值
- ExtJS Grid 分页时保持选中的简单实现方法
- ie中ExtJs的Grid不能默认选中第一行的解决方法
- 解决Grid组件无法初始选中问题
- ExtJS Grid 获得选中项数据
- extjs 获取grid选中项的id
- Extjs grid checkbox 根据数据初始化选中
- Extjs 5 grid选中指定行
- extjs 动态设置grid选中状态
- stringstream的用法
- iPhone对OpenGL ES的支持程度!
- 数据库并发控制
- java基础:异常
- ORACLE中调用JAVA类才出现ORA-29538、ORA-29532、ORA-29913问题解决
- extjs Grid 时,默认初始选中
- 获得电池充电状态
- 可扩展认证协议(EAP)5.初始化的EAP请求/应答类型
- cocos2d-x 字体使用方法浅析
- 循环队列(c语言)
- Android.mk简介
- Loader
- Android-- EditText与InputFilter实现文本对比
- getaddrinfo, getnameinfo(替代gethostbyname, gethostbyaddr), gethostname