JQGrid: изменить размер сетки после изменения размера столбца

Question

Я хотел бы изменить ширину сетки после изменения размера столбца (поэтому ширина сетки будет соответствовать сумме ширины столбцов, включая новую ширину столбца с измененным размером). Это должно предотвратить появление горизонтальной полосы прокрутки.

Это похоже на этот вопрос, где в дополнение к изменению размера сетки после скрытия / отображения столбцов, я хотел бы изменить размер при расширении / сжатии столбцов:

Если вы посмотрите демонстрацию в вопросе, предоставленном @Oleg, то увидите, что размер сетки не изменяется при изменении размера столбца.

E сть resizeStop событие, которое я мог бы использовать, а затем использовать метод setGridWidth установить сетку на ширину суммы ширин столбцов. Я не уверен, как суммировать ширину столбцов, хотя... Может быть, есть что-то встроенное в JQGrid, которое я мог бы использовать, чтобы сделать это легко?

Большое спасибо за любой совет!

Answer 1

Я лично нахожу вопрос очень хорошим. Я делаю много предложений, как улучшить алгоритм расчета ширины сетки. Дважды я включал в свои предложения поведение, которое вы хотите, но Тони (разработчик jqGrid) удалил часть изменений.

Реализовать ваши требования в текущей версии jqGrid очень просто, но в коде используются некоторые внутренние структуры сетки. Поэтому вы должны проверить, будет ли этот трюк работать и в следующих версиях. Код resizeStop обратный вызов может быть следующим:

resizeStop: function () {
    $(this.bDiv).find('>div:first>table.ui-jqgrid-btable:first')
                .jqGrid('setGridWidth', this.newWidth);
}

Демонстрация показывает вживую, как это работает.

Сложность общего решения для jqGrid выше, потому что иногда нужно держать указанную ширину сетки. Моя точка зрения здесь следующая: если пользователь указывает width Опция во время инициализации сетки (создание), то он хочет держать ширину. С другой стороны, если нет width Опция указывается при создании сетки одним желанием (как и вы, как хотите) расчета общей ширины сетки на основе суммы значений ширины всех столбцов. В случае, если ширина некоторого столбца будет изменена, ширина сетки также должна быть скорректирована (пересчитана). Проблема только в том, что оригинал пустой width опция будет перезаписана при создании сетки. Мое предложение было бы сохранить первоначальную стоимость width вариант в widthOrg опция при создании сетки. Таким образом, можно будет проверить первоначальное значение width и выбрать лучшее поведение изменения размера сетки после изменения размера столбца.

ОБНОВЛЕНО: После некоторого обсуждения с вами в комментариях и отладки кода jqGrid, я надеюсь, что нашел решение, которое работает правильно, независимо от значения shrinkToFit параметр. Решение состоит из изменения кода resizeStop к следующему

resizeStop: function () {
    var $grid = $(this.bDiv).find('>div:first>table.ui-jqgrid-btable:first'),
        shrinkToFit = $grid.jqGrid('getGridParam', 'shrinkToFit');

    $grid.jqGrid('setGridWidth', this.newWidth, shrinkToFit);
}

и изменение двух строк внутреннего showHideCol метод jqGrid. Это первое изменение линии

cw = this.widthOrg? this.widthOrg: parseInt(this.width,10);

в

cw = this.widthOrg && $t.p.shrinkToFit ? this.widthOrg: parseInt(this.width,10);

и изменение другой строки

$($t).jqGrid("setGridWidth",$t.p.shrinkToFit === true ? $t.p.tblwidth : $t.p.width );

в

$($t).jqGrid("setGridWidth", $t.p.tblwidth);

Вы можете получить модифицированную версию jqGrid здесь. Первая демонстрация использует код с shrinkToFit: true и вторая демка использует тот же код, но без опции shrinkToFit: true,

Я думаю, что на следующий день, как сделать исправление работоспособным, также в случае использования исправлено width вариант jqGrid во время создания и опубликует мое предложение на форуме trirand.

Если вы хотите использовать свернутую версию jqGrid, вы можете либо свернуть ее самостоятельно, либо использовать оригинальную свернутую версию jqGrid и перезаписать только showHideCol метод в отношении $.jgrid.extend, Смотрите демо.

ОБНОВЛЕНО: после изменения значения this в более поздних версиях jqGrid следует изменить приведенный выше код resizeStop Обратный вызов примерно следующее:

resizeStop: function () {
    var $self = $(this),
        shrinkToFit = $self.jqGrid("getGridParam", "shrinkToFit");

    $self.jqGrid("setGridWidth", this.grid.newWidth, shrinkToFit);
}

Answer 2

Я делаю функцию

var grid_setAutoWidth = function() {

    var columnas = $(this).jqGrid('getGridParam', 'colModel');

    var anchoTotal = 0;
    for (var i = 0; columnas[i]; i++) {
        anchoTotal += columnas[i].width;
    }

    anchoTotal += 50;
    $(this).jqGrid('setGridWidth', anchoTotal);

};

... а затем, в параметрах сетки

shrinkToFit: false,
loadComplete: grid_setAutoWidth,
resizeStop: grid_setAutoWidth,

Я думаю, что это самый простой способ