extjs Grid 时,默认初始选中

最近在使用带复选框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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值