Подтвердить что ты не робот

Изменить размер jqGrid на основе количества строк?

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

Если, однако, слишком много строк, высота сетки будет расширяться до максимального значения "высота", и появится полоса прокрутки.

4b9b3361

ОТВЕТЫ

Ответ 2

Try:

jQuery(".ui-jqgrid-bdiv").css('height', jQuery("#bigset").css('height'));

В функции обратного вызова jQGrid loadComplete. #bigset - это id для таблицы, которую я использовал. Это отлично сработало для меня.

Ответ 3

Я столкнулся с подобной проблемой, и ни одно из решений не работало идеально для меня. Некоторые работы, но затем нет полосы прокрутки.

Итак, вот что я сделал:

jQuery("#grid").jqGrid('setGridHeight', Math.min(300,parseInt(jQuery(".ui-jqgrid-btable").css('height'))));

Этот код должен быть помещен в обработчик loadComplete, а затем он отлично работает. Первый параметр Math.min - это желаемая высота, когда для заполнения списка достаточно данных. Учтите, что это же значение должно быть задано как высота для сетки. Этот script выбирает минимальную фактическую высоту и желаемую высоту сетки. Так что, если не хватает строк, высота сетки сжимается, в противном случае у нас всегда будет одинаковая высота!

Ответ 4

вызовите следующую функцию из afterInsertRow и при удалении строки:

function adjustHeight(grid, maxHeight){
    var height = grid.height();
    if (height>maxHeight)height = maxHeight;
    grid.setGridHeight(height);
}

Ответ 5

Хотя высота 100% отлично работала в демо, это не сработало для меня. Сетка стала намного больше, возможно, она пыталась занять родительскую высоту div. Решение Amit отлично работает для меня, спасибо! (Я новичок в качестве вкладчика здесь, поэтому мне нужна более высокая "репутация", чтобы отметить любые голоса:))

Ответ 6

Вот общий метод, который я разработал на основе решения Amit. Это позволит вам указать максимальное количество отображаемых строк. Он использует высоту заголовка сетки для вычисления максимальной высоты. Возможно, вам потребуется tweeking, если ваши строки не имеют той же высоты, что и ваш заголовок. Надеюсь, что это поможет.

function resizeGridHeight(grid, maxRows) {
    // this method will resize a grid height based on the number of elements in the grid
    // example method call: resizeGridHeight($("#XYZ"), 5)
    // where XYZ is the id of the grid table element
    // DISCLAIMER: this method is not heavily tested, YMMV

    // gview_XYZ is a div that contains the header and body divs
    var gviewSelector = '#gview_' + grid.attr('id');
    var headerSelector = gviewSelector + ' .ui-jqgrid-hdiv';
    var bodySelector = gviewSelector + ' .ui-jqgrid-bdiv';

    // use the header height as a base for calculating the max height of the body
    var headerHeight = parseInt($(headerSelector).css('height'));
    var maxHeight = maxRows * headerHeight;

    // grid.css('height') is updated by jqGrid whenever rows are added to the grid
    var gridHeight = parseInt(grid.css('height'));
    var height = Math.min(gridHeight, maxHeight);
    $(bodySelector).css('height', height);
}

Ответ 7

Добавьте ниже код внутри loadComplete function

var ids = grid.jqGrid('getDataIDs');
//setting height for grid to display 15 rows at a time
if (ids.length > 15) {
    var rowHeight = $("#"+gridId +" tr").eq(1).height();
    $("#"+gridId).jqGrid('setGridHeight', rowHeight * 15 , true);
} else {
//if rows are less than 15 then setting height to 100%
    $("#"+gridId).jqGrid('setGridHeight', "100%", true);
}