Extjs 4.2.x 关于RowExpander的问题

银点 2014-07-05 04:42:40

Ext.override(Ext.grid.plugin.RowExpander, { // Override to fire collapsebody & expandbody
init: function(grid) {
this.callParent(arguments);
grid.getView().addEvents('collapsebody', 'expandbody');
},
toggleRow: function(rowIdx, record) {
var me = this,
view = me.view,
rowNode = view.getNode(rowIdx),
row = Ext.fly(rowNode, '_rowExpander'),
nextBd = row.down(me.rowBodyTrSelector, true),
isCollapsed = row.hasCls(me.rowCollapsedCls),
addOrRemoveCls = isCollapsed ? 'removeCls' : 'addCls',
ownerLock, rowHeight, fireView;


// Suspend layouts because of possible TWO views having their height change
Ext.suspendLayouts();
row[addOrRemoveCls](me.rowCollapsedCls);
Ext.fly(nextBd)[addOrRemoveCls](me.rowBodyHiddenCls);
me.recordsExpanded[record.internalId] = isCollapsed;
view.refreshSize();


// Sync the height and class of the row on the locked side
if (me.grid.ownerLockable) {
ownerLock = me.grid.ownerLockable;
// fireView = ownerLock.getView();
view = ownerLock.lockedGrid.view;
fireView=ownerLock.lockedGrid.view;
rowHeight = row.getHeight();
// EXTJSIV-9848: in Firefox the offsetHeight of a row may not match
// it's actual rendered height due to sub-pixel rounding errors. To ensure
// the rows heights on both sides of the grid are the same, we have to set
// them both.
row.setHeight(isCollapsed ? rowHeight : '');
row = Ext.fly(view.getNode(rowIdx), '_rowExpander');
row.setHeight(isCollapsed ? rowHeight : '');
row[addOrRemoveCls](me.rowCollapsedCls);
view.refreshSize();
} else {
fireView = view;
}
fireView.fireEvent(isCollapsed ? 'expandbody' : 'collapsebody', row.dom, record, nextBd);
// Coalesce laying out due to view size changes
Ext.resumeLayouts(true);
},
});

//Ext.loader.setConfig({enabled:true});
Ext.onReady(function() {
Ext.QuickTips.init();
var store = new Ext.data.Store({

fields:[
{name:'fileName',type:'string'},
{name:'room',type:'string'},
{name:'recordDate',type:'string'},

],
data:[
{fileName:'文件1',room:'会议室1',recordDate:'2014-07-03'},
{fileName:'文件2',room:'会议室2',recordDate:'2014-07-03'},
{fileName:'文件3',room:'会议室3',recordDate:'2014-07-03'}
],
autoLoad:true
});
var expander = new Ext.grid.plugin.RowExpander({
ptype:'rowexpander',
rowBodyTpl:new Ext.XTemplate('<div class="detailData">pp</div>'),
listensers:{
expandbody:function(){
console.info('fired');
}
}
});

Ext.create('Ext.grid.Panel',{
xtype: 'row-expander-grid',
store: store,
renderTo:Ext.getBody(),
columns: [
{text: "文件名称", flex: 1, dataIndex: 'fileName'},
{text: "会议室", dataIndex: 'room'},
{text: "录制日期", renderer: Ext.util.Format.dateRenderer('Y-m-d'), dataIndex: 'recordDate'}
],
width: 600,
height: 300,
plugins:expander,
collapsible: true,
animCollapse: false,
title: 'Expander Rows in a Collapsible Grid',
iconCls: 'icon-grid'
});
});

...全文
138 点赞 收藏 3
写回复
3 条回复
银点 2014年07月06日
引用 2 楼 showbo 的回复:
给view加无效,应该bug没有解决。。。给grid添加事件可以。。 参考这个:Ext4.2+ Ext.grid.plugin.RowExpander如何触发collapsebody,expandbody
谢谢,已经解决了,和您这帖子内容一致。
回复 点赞
给view加无效,应该bug没有解决。。。给grid添加事件可以。。 参考这个:Ext4.2+ Ext.grid.plugin.RowExpander如何触发collapsebody,expandbody
回复 点赞
银点 2014年07月05日
忘了说问题了:expander的expandbody事件不影响,有谁在extjs4.2.x版本做过这个功能?请指教!
回复 点赞
发动态
发帖子
Ajax
创建于2007-09-28

3.2w+

社区成员

2.5w+

社区内容

Web 开发 Ajax
社区公告
暂无公告