/* * Ext JS Library 2.0 * Copyright(c) 2006-2007, Ext JS, LLC. * licensing@extjs.com * * http://extjs.com/license * * MODIFIED: SGB [12.12.07] * Added support for a new config option, remoteDataMethod, * including getter and setter functions, and minor mods * to the beforeExpand and expandRow functions */ Ext.grid.RowExpander = function(config) { Ext.apply(this, config); Ext.grid.RowExpander.superclass.constructor.call(this); if (this.tpl) { if (typeof this.tpl == 'string') { this.tpl = new Ext.Template(this.tpl); } this.tpl.compile(); } this.state = {}; this.bodyContent = {}; this.addEvents({ beforeexpand : true, expand: true, beforecollapse: true, collapse: true }); }; Ext.extend(Ext.grid.RowExpander, Ext.util.Observable, { header: "", width: 20, sortable: false, fixed:true, dataIndex: '', id: 'expander', lazyRender : true, enableCaching: true, getRowClass : function(record, rowIndex, p, ds) { p.cols = p.cols-1; var content = this.bodyContent[record.id]; if (!content && !this.lazyRender) { content = this.getBodyContent(record, rowIndex); } if (content) { p.body = content; } return this.state[record.id] ? 'x-grid3-row-expanded' : 'x-grid3-row-collapsed'; }, init : function(grid) { this.grid = grid; var view = grid.getView(); view.getRowClass = this.getRowClass.createDelegate(this); view.enableRowBody = true; grid.on('render', function() { view.mainBody.on('mousedown', this.onMouseDown, this); }, this); grid.store.on('load', this.onStoreLoaded, this); grid.on("beforestaterestore", this.applyState, this); grid.on("beforestatesave", this.saveState, this); }, /** @private */ onStoreLoaded: function(store, records, options) { var index = -1; for(var key in this.state){ if (this.state[key] === true) { index = store.indexOfId(key); if (index > -1) { this.expandRow(index); } } } }, /** @private */ applyState: function(grid, state){ this.suspendStateStore = true; if(state.expander) { this.state = state.expander; } this.suspendStateStore = false; }, /** @private */ saveState: function(grid, state){ return state.expander = this.state; }, getBodyContent : function(record, index) { if (!this.enableCaching) { return this.tpl.apply(record.data); } var content = this.bodyContent[record.id]; if (!content) { content = this.tpl.apply(record.data); this.bodyContent[record.id] = content; } return content; }, // Setter and Getter methods for the remoteDataMethod property setRemoteDataMethod : function (fn) { this.remoteDataMethod = fn; }, getRemoteDataMethod : function (record, index) { if (!this.remoteDataMethod) { return; } return this.remoteDataMethod.call(this,record,index); }, onMouseDown : function(e, t) { if (t.className == 'x-grid3-row-expander') { e.stopEvent(); var row = e.getTarget('.x-grid3-row'); this.toggleRow(row); } }, renderer : function(v, p, record) { p.cellAttr = 'rowspan="2"'; return '
'; }, beforeExpand : function(record, body, rowIndex) { if (this.fireEvent('beforexpand', this, record, body, rowIndex) !== false) { // If remoteDataMethod is defined then we'll need a div, with a unique ID, // to place the content if (this.remoteDataMethod) { this.tpl = new Ext.Template("