JQGrid Columna Ancho automático

Question

Me pregunto cómo podemos establecer un ancho de columna jqGrid en automático?

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

de la declaración anterior, ¿cómo puedo especificar un ancho automático de la columna para que se ajuste al tamaño del contenido máximo en ella.

Answer 1

No hay forma de especificar la columna de auto ancho en jqGrid. Pero puede usar la opción shrinkToFit de un conjunto de grillas en verdadero y establecer algunos valores de ancho aproximado (por ejemplo, 20, 20, 20, 80) y el ancho de las columnas se escalará al ancho de una grilla.

Reducir hasta ajustar:

Esta opción describe el tipo de cálculo de la anchura inicial de cada columna contra con la anchura de la rejilla. Si el valor es verdadero y se establece la opción de valor en ancho, entonces: El ancho de cada columna se escala de acuerdo con el ancho de la opción definida. Ejemplo: si definimos dos columnas con un ancho de 80 y 120 píxeles, pero queremos que la cuadrícula tenga 300 píxeles, las columnas se recalculan de la siguiente manera: 1 columna = 300 (ancho nuevo)/200 (suma de todos los valores)) * 80 (ancho de columna) = 120 y 2 columnas = 300/200 * 120 = 180. El ancho de la cuadrícula es 300px. Si el valor es falso y se establece la opción de valor en ancho, entonces: El ancho de la grilla es el ancho establecido en la opción. El ancho de la columna no se recalcula y tiene los valores definidos en colModel.

Answer 2

Puede intentar usar tableToGrid, por lo que recuerdo, conserva los anchos. Si es así, también puede ver su código fuente si su comportamiento no se ajusta completamente a sus necesidades.

Answer 3

Puede usar el método setGridWidth.

Ejemplo:

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

DEMO

Answer 4

Esto es sobre todo trabajando para mí.

<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> 

Answer 5

Try this. Worked For Me 

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

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