SitePen / dgrid

A lightweight, mobile-ready, data-driven, modular grid widget designed for use with dstore
http://dgrid.io/
Other
628 stars 295 forks source link

ColumnReorder and ColumnSet #1270

Open riaeasy opened 8 years ago

riaeasy commented 8 years ago

Hi, The column can't reorder When Grid declared from ColumnReorder and ColumnSet. The reason for this weakness in ColumnReorder.renderHeader uses grid.columnSets, but the Grid.renderHeader uses grid.subRows.headerRows.

In ColumnSet:

function getColumnSetSubRows(subRows, columnSetId, startRow) {
    // Builds a subRow collection that only contains columns that correspond to
    // a given column set id.
    if (!subRows || !subRows.length) {
        return;
    }
    var subset = [],
        idPrefix = columnSetId + '-',
        i = startRow || 0,
        numRows = subRows.length;
    for (; i < numRows; i++) {
        var row = subRows[i];
        var subsetRow = [];
        subsetRow.className = row.className;
        for (var k = 0, numCols = row.length; k < numCols; k++) {
            var column = row[k];
            // The column id begins with the column set id.
            if (column.id != null && column.id.indexOf(idPrefix) === 0) {
                column.columnSetId = columnSetId;
                subsetRow.push(column);
            }
        }
        subset.push(subsetRow);
    }
    return subset;
}

In ColumnReorder:

    renderHeader: function () {
        function makeDndTypePrefix(gridId) {
            return 'dgrid-' + gridId + '-';
        }
        var dndTypePrefix = makeDndTypePrefix(this.id),
            csLength, cs;

        this.inherited(arguments);

        // After header is rendered, set up a dnd source on each of its subrows.

        this._columnDndSources = [];

        /// 保持与 Grid.renderHeader 和 _createHeaderRowCell 一致,
        /// 增加使用 this.subRows.headerRows
        if (this.columnSets) {
            // Iterate columnsets->subrows->columns.
            if(this.subRows && this.subRows.headerRows){
                for (cs = 0, csLength = this.columnSets.length; cs < csLength; cs++) {
                    rias.forEach(getColumnSetSubRows(this.subRows.headerRows, cs, 1), function (subRow, sr) {
                        this._initSubRowDnd(subRow, dndTypePrefix + cs + '-' + sr);
                    }, this);
                }
            }else{
                for (cs = 0, csLength = this.columnSets.length; cs < csLength; cs++) {
                    rias.forEach(this.columnSets[cs], function (subRow, sr) {
                        this._initSubRowDnd(subRow, dndTypePrefix + cs + '-' + sr);
                    }, this);
                }
            }
        }
        else {
            // Iterate subrows->columns.
            rias.forEach(this.subRows, function (subRow, sr) {
                this._initSubRowDnd(subRow, dndTypePrefix + sr);
            }, this);
        }
    }
edhager commented 8 years ago

@riaeasy, have you looked at the manual test pages: http://dgrid.io/js/dgrid/test/extensions/ColumnReorder_complex.html. There is an example of using ColumnReorder with ColumnSet. Check the order in which you are applying the mixins because the order is important:

new (declare([OnDemandGrid, ColumnSet, ColumnReorder]))