Redimensionner jqGrid en fonction du nombre de lignes?

Essayez:

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

Dans la fonction de rappel jQGrid loadComplete. #bigset est le id pour la table que j'ai utilisé. Cela a fonctionné parfaitement pour moi.

J'ai fait face au problème similaire et aucune des solutions n'a parfaitement fonctionné pour moi. Certains fonctionnent mais il n'y a pas de barre de défilement.

Voici Donc ce que j'ai fait:

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

Ce code doit être placé dans le gestionnaire loadComplete et cela fonctionne bien. Le premier paramètre du calcul.min est la hauteur désirée quand il y a assez de données pour remplir la liste. Notez que cette même valeur doit être définie comme hauteur pour la grille. Ce script choisit le minimum de la hauteur réelle et la hauteur désirée de la grille. Donc, s'il n'y a pas assez de lignes, la hauteur de la grille est réduite, sinon nous avons toujours la même hauteur!

Appelez la fonction ci-dessous depuis afterInsertRow et lors de la suppression d'une ligne:

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

Bien que la hauteur 100% a bien fonctionné dans la démo, cela n'a pas fonctionné pour moi. La grille est devenue beaucoup plus grande, peut-être qu'elle a essayé d'occuper la hauteur du div parent. La solution d'Amit a parfaitement fonctionné pour moi, merci! (Je suis nouveau en tant que contributeur ici, et j'ai donc besoin d'une "réputation" plus élevée pour marquer les votes:))

Voici une méthode générique que j'ai trouvée basée sur la solution D'Amit. Il vous permettra de spécifier le nombre maximum de lignes à afficher. Il utilise la hauteur d'en-tête de la grille pour calculer la hauteur maximale. Il peut avoir besoin de tweeking si vos lignes ne sont pas de la même hauteur que votre en-tête. Espérons que cela aide.

function resizeGridHeight(grid, maxRows) {
    // this method will resize a grid's height based on the number of elements in the grid
    // example method call: resizeGridHeight($("#XYZ"), 5)
    // where XYZ is the id of the grid's 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's 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);
}

Ajouter le code ci-dessous à l'intérieur de la fonction loadComplete

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);
}