重谈ExtGrid 扩展行自动展开(一)（expanded row 默认展开）

很长一段时间不碰JS，实际上心里也非常讨厌编码--这点不像团队中另外两个兄弟（两人是疯狂的javascript writer）。

今天在做grid时，遇到了须在gird里加入一个row expander,且这个expander要默认展开。按以往经验，第一想到的是：在grid 上加入一个plugins.但加完后发现这些expander没办法自动展开。

我在网上搜了一些前人的解决办法，有人提到：在grid的listener上的事件上加入（好像是这种写，不记得了,大概像这种）：listenners:{'viewready':function(g){

foreach(v r in g.veiw.getRows())

{

　　r.toggleRow();

}

}};

但我在查'viewready'时，文档是这么描述：Fires when the grid view is available (use this for selecting a default row). 这句话的意思也就意味着假如我没有设置一条被选中的默认记录，此事件就不会被触发。

心想，还是查extjs doc吧。当我查阅资料时，发现了grid有这么一个属性：viewConfig。

按字面意思：展现界面某些属性是可设置的，因此，我作出以下调整：

 

_canBeBroadedGrid = Ext.ComponentMgr.create(Ext.apply({
                width: 'auto',
                viewConfig: {
                    forceFit: true,
                    enableRowBody: true,
                    getRowClass: function (record, rowIndex, p) {
                        p.body = String.format('<div class="contacterInfo">提供人：<span class="author">{1} {2}</span></div><p class="rowExpandContent">{0}</p>', record.data.Content, record.data.Contacter, record.data.ContacterPhone);
                        return 'x-grid3-row-expanded';
                    }
                },
                width: 450,
                height: 450,
                region: 'west',
                xtype: 'gridPanel',
                columns: _getColumns(),
                sm: new Ext.grid.CheckboxSelectionModel({ singleSelect: true }),
                fields: _getFields(),
               ....            }));

即通过：

 viewConfig: {
                    forceFit: true,
                    enableRowBody: true,
                    getRowClass: function (record, rowIndex, p) {
                        p.body = String.format('<div class="contacterInfo">提供人：<span class="author">{1} {2}</span></div><p class="rowExpandContent">{0}</p>', record.data.Content, record.data.Contacter, record.data.ContacterPhone);
                        return 'x-grid3-row-expanded';
                    }
                }就可以达到默认展开的目，用不着在viewready事件上做文章。