2010-02-19 7 views
18

jqGrid 열 너비를 자동으로 설정할 수있는 방법이 궁금합니다. 그것의 최대 내용의 크기에 맞도록 내가 열의 자동 폭을 지정할 수있는 방법을 위의 문에 대한 JQGrid 열 자동 너비

... 
colModel: [ 
{ name: 'MyDescription', index: 'description', align: 'left', width: 150, sortable: false }, 
... 

.

답변

27

jqGrid에서 자동 너비 열을 지정할 방법이 없습니다. 그러나 격자의 shrinkToFit 옵션을 true로 설정하고 대략적인 너비 값 (예 : 20, 20, 20, 80)을 설정할 수 있으며 열의 너비는 격자 너비로 조정됩니다.

shrinkToFit는 :

이 옵션은 그리드의 폭에 대해 각 항목의 초기 폭의 계산의 유형을 설명한다. 값이 true이고 width 옵션의 값이 설정된 경우 : 모든 열 너비는 정의 된 옵션 너비에 따라 조정됩니다. 예 : 너비가 80과 120 픽셀 인 두 개의 열을 정의했지만 그리드의 크기가 300 픽셀이되도록하려면 열이 다음과 같이 다시 계산됩니다. 1 열 = 300 (새 너비)/200 (모든 너비의 합) * 80 (열 너비) = 120 및 2 열 = 300/200 * 120 = 180입니다. 격자 폭은 300px입니다. 값이 false이고 width 옵션의 값이 설정된 경우 : 격자의 폭은 option에 설정된 폭입니다. 열의 폭은 재 계산되지 않고 colModel에 정의 된 값을가집니다.

+24

이있는 jqGrid의 주요 단점이다. –

0

tableToGrid은 너비를 유지한다는 것을 기억하는 한 사용할 수 있습니다. 그렇다면, 그 행동이 당신의 요구에 완전히 부합하지 않는다면 소스 코드를 조사 할 수도 있습니다.

8

setGridWidth 메서드를 사용할 수 있습니다.

예 :

$(window).on('resize', function() { 
    $("#jqgrid").setGridWidth($(window).width()); 
}).trigger('resize'); 

DEMO

1

이 주로 나를 위해 노력하고 있습니다.

<div id="myjqgridwrapper" style="width:100%;"> 
    <table id="myjqgrid"></table> 
    <div id="myjqgridfooter"></div> 
</div> 

<script type="text/javascript"> 
    //script to autosize grid 
    //don't forget autowidth:true for initial size 
    $(window).bind('resize', function(){ 
     //set to 0 so grid does not continually grow 
     $('#myjqgrid').setGridWidth(0); 
     //resize to our container's width 
     $('#myjqgrid').setGridWidth($('#myjqgridwrapper').width()); 
    }).trigger('resize'); 
</script> 
1
Try this. Worked For Me 

.ui-common-table{ 
    width: 100% !important; 
} 

.ui-jqgrid .ui-jqgrid-hbox{ 
    padding-right: 0px !important; 
} 
+0

이것은 나를 위해 작동하지 않았다. – abd3721