행 수에 따라 jqGrid 크기를 조정 하시겠습니까?

Question

내 jqGrid를 축소하고 확장 할 수있는 행의 수를 기준으로합니다. 현재 10 개의 행이 있다고 가정 해 봅시다. jqGrid의 높이는 10 개의 행으로 축소됩니다 (텅 빈 빈 행이 노출되지 않도록).

너무 많은 행이있는 경우 그리드의 높이가 최대 '높이'값으로 확장되고 스크롤 막대가 나타납니다.

Answer 1

그리드에 내장되어 있습니다. height을 100 %로 설정합니다. There's a demo on this page 당신은 "고급 가면 -> 크기 조정

Answer 2

전화 afterInsertRow에서 아래의 기능과 행 삭제하는 경우 :

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

Answer 3

시도해보십시오있는 jqGrid 콜백 함수 loadComplete에서

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

#bigset을.. 내가 사용하는 테이블에 대한 id입니다. 이것은 나를 위해 완벽하게 작동했습니다.

Answer 4

높이 100 % wo 데모에서 좋은 rked, 그것은 나를 위해 작동하지 않았다. 그리드가 훨씬 커졌고 어쩌면 부모 div의 높이를 차지하려고했습니다. Amit의 솔루션이 완벽하게 작동했습니다. 감사합니다. (저는 여기에 기고자로 새로 나서 어떤 표를 붙이기 위해 더 높은 평판이 필요합니다 :))

Answer 5

나는 비슷한 문제에 직면 해 왔으며 아무 해결책도 완벽하게 작용하지 못했습니다. 일부는 작동하지만 스크롤바는 없습니다. 그래서 여기

내가 무엇을했는지 있습니다 :

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

이 코드는 loadComplete 처리기에 배치해야하고 그것을 잘 작동합니다. Math.min의 첫 번째 매개 변수는 목록에 채울 충분한 데이터가있을 때 원하는 높이입니다. 이 값은 그리드의 높이로 설정해야합니다. 이 스크립트는 실제 높이와 그리드의 원하는 높이 중 최소값을 선택합니다. 행 수가 충분하지 않으면 그리드 높이가 축소됩니다. 그렇지 않으면 항상 같은 높이가됩니다!

Answer 6

다음은 Amit의 솔루션에 기반한 일반적인 방법입니다. 표시 할 최대 행 수를 지정할 수 있습니다. 그리드의 헤더 높이를 사용하여 최대 높이를 계산합니다. 행이 머리글과 같은 높이가 아닌 경우에는 집게가 필요합니다. 희망이 도움이됩니다.

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

Answer 7

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