重谈ExtGrid 扩展行自动展开(二)（expanded row 默认展开、可收缩）

如果我们按《重谈ExtGrid 扩展行自动展开(一)》来进行row的扩展的话，当你完成工作时，你就会发现Grid的Row是没办法展开或是收缩的。

本想也做过plugins，无奈功力不够。

借助于doc中的代码，我作了以下调整：

var rowExpanderHelper = {
    init: function (grid) { this.grid = grid; this.state = {}; },
    onRowDblClick: function (grid, rowIdx, e) {
        rowExpanderHelper.toggleRow(rowIdx);
    },
    toggleRow: function (row) {
        if (typeof row == 'number') {
            row = this.grid.view.getRow(row);
        }
        if (row)
            this[Ext.fly(row).hasClass('x-grid3-row-collapsed') ? 'expandRow' : 'collapseRow'](row);
    },
    beforeExpand: function (record, body, rowIndex) {
        if (this.grid.fireEvent('beforeexpand', this, record, body, rowIndex) !== false) {
            if (this.grid.tpl && this.grid.lazyRender) {
                body.innerHTML = this.getBodyContent(record, rowIndex);
            }
            return true;
        } else {
            return false;
        }
    },
    onMouseDown: function (e, t) {
        e.stopEvent();
        var row = e.getTarget('.x-grid3-row');
        rowExpanderHelper.toggleRow(row);
    },
    expandRow: function (row) {
        if (typeof row == 'number') {
            row = this.grid.view.getRow(row);
        }
        var record = this.grid.store.getAt(row.rowIndex);
        var body = Ext.DomQuery.selectNode('tr:nth(2) div.x-grid3-row-body', row);
        if (this.beforeExpand(record, body, row.rowIndex)) {
            this.state[record.id] = true;
            Ext.fly(row).replaceClass('x-grid3-row-collapsed', 'x-grid3-row-expanded');
            this.grid.fireEvent('expand', this, record, body, row.rowIndex);
        }
    },

    collapseRow: function (row) {
        if (typeof row == 'number') {
            row = this.grid.view.getRow(row);
        }
        var record = this.grid.store.getAt(row.rowIndex);
        var body = Ext.fly(row).child('tr:nth(1) div.x-grid3-row-body', true);
        if (this.grid.fireEvent('beforecollapse', this, record, body, row.rowIndex) !== false) {
            this.state[record.id] = false;
            Ext.fly(row).replaceClass('x-grid3-row-expanded', 'x-grid3-row-collapsed');
            this.grid.fireEvent('collapse', this, record, body, row.rowIndex);
        }
    }
}

使用的例子如下：

 _gridRowExpandedToggle: function (grid) {
        rowExpanderHelper.init(grid);
        grid.on('rowdblclick', rowExpanderHelper.onRowDblClick, this);
        grid.on('mousedown', rowExpanderHelper.onMouseDown, this);
        var mainBody = grid.getView().mainBody;
        mainBody.on('mousedown', rowExpanderHelper.onMouseDown, this, { delegate: '.x-grid3-row-expander' });
    }

 _gridRowExpandedToggle（“grid对像”）；