jquery - Barra de desplazamiento horizontal jqGrid

jquery-plugins scrollbar

Question

Desarrollé la interfaz AJAX con jQuery y jqGrid.

¿Cómo puedo eliminar la barra de desplazamiento horizontal de mi tabla jqGrid?

http://dskarataev.ru/jqgrid.png

Si establezco el autowidth: true , entonces obtengo el ancho de la tabla = suma del ancho de las columnas, pero necesito el ancho de la tabla = ancho del elemento padre con id devuelto por la función getSelectedTabHref()

entonces hago la función:

$(window).bind(''resize'', function() {
  $(''#tasks'').setGridWidth($(getSelectedTabHref()).width());
  $(''#tasks'').setGridHeight($(window).height()-190);
}).trigger(''resize'');

y aquí es cómo creo la tabla jqGrid:

$(''#tasks'').jqGrid({
  datatype: ''local'',
  colNames:[labels[''tasksNum''],labels[''tasksAdded'']+"/"+labels[''tasksAccepted''],labels[''tasksOperator''],labels[''tasksClient''],labels[''tasksManager''],labels[''tasksDesc'']],
  colModel :[
    {name:''taskId'', index:''taskId'', width:1, align:''right''},
    {name:''taskAdded'', index:''taskAdded'', width:3},
    {name:''taskOperator'', index:''taskOperator'', width:4},
    {name:''taskClient'', index:''taskClient'', width:7},
    {name:''taskManager'', index:''taskManager'', width:4},
    {name:''taskDesc'', index:''taskDesc'', width:8}]
});

Answer 1

Establecer un width explícito en la grilla y usar

autowidth: false,
shrinkToFit: true

Answer 2

Ajusté ui.grid.css porque no necesitaba una barra de desplazamiento horizontal. hice esto:

.ui-jqgrid .ui-jqgrid-bdiv {
  position: relative; 
  margin: 0em; 
  padding:0; 
  /*overflow: auto;*/ 
  overflow-x:hidden; 
  overflow-y:auto; 
  text-align:left;
}

el comentario fue como era, acabo de usar overflow-x para ocultar la barra de desplazamiento horizontal y ahora todo está bien conmigo.

Answer 3

utilicé el método API jqgrid setGridHeight. me funciona bien en IE 8 también.

var gr = jq(''#grid'');
gr.setGridHeight(350,true);

Pongo estas líneas en la llamada a la función ''loadComplete''.

Answer 4

un poco tarde, pero podría ser útil para alguien

Debes establecer la altura de la tabla solo en números, sin ''px'' al final

Answer 5

Aplique ApearanceSettings ShrinkToFit="False" y AutoWidth="true" a su jqGrid .

Answer 6

Aquí vamos width : ''1083'' , shrinkToFit:false,

Cuando establecemos lo anterior, debemos asegurarnos de que nuestro ui.jqgird.css esté configurado como se muestra a continuación.

.ui-jqgrid .ui-jqgrid-bdiv { height: auto; margin: 0em; max-height: 250px; overflow-x: auto; overflow-y: auto; padding: 0px; position: relative; text-align: left; }

Answer 7

Es simple, uso en jqgrid shrinkToFit: false

Answer 8

Hay algunas situaciones en las que jqGrid calcula el ancho de la cuadrícula incorrecto. Puede intentar aumentar el parámetro cellLayout (consulte http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options ). Esto puede ser necesario si cambia algunos CSS de jqGrid.

En algunas otras situaciones, puede corregir el ancho con respecto a la función fixGridWidth o fixGridSize que describí en Correctamente llamando a setGridWidth en un jqGrid dentro de un cuadro de diálogo jQueryUI . No olvides que debes usarlo dentro de loadComplete .

Answer 9

setGridWidth definitivamente cambiará el tamaño de su grilla a la del ancho nuevo dado, pero asegúrese de usarla con autowidth = true. setGridWidth puede tener problemas con IE 7 más o menos.

Algunas soluciones de trabajo discutidas aquí (en caso de que aún no hayas encontrado una solución),

Cambiar el tamaño de jqGrid cuando se cambia el tamaño del navegador?

http://www.trirand.com/blog/?page_id=393/discussion/browser-resize-how-to-resize-jqgrid/

----antiguo----

Hay un par de opciones que puedes probar,

Desde http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options

"autowidth" : true    

o

"shrinkToFit": false

De lo contrario, publique su código jqgrid, analicémonos.