¿Por qué los encabezados de mi dgrid dojo no aparecen a menos que cambie el tamaño del navegador?

Question

Tengo una cuadrícula con encabezados que no aparecerán a menos que cambie el tamaño de la ventana del navegador. Tan pronto como cambio el tamaño de la ventana del navegador, aparecen los títulos. ¿Cómo puedo obtener los encabezados para mostrar sin cambiar el tamaño del navegador?

¿No estoy llamando a startup () correctamente? ¿Hay algún evento que pueda despedir para hacer que dgrid piense que el navegador ha sido redimensionado?

Answer 1

Así que agregué un onShow eventos onShow al ContentPane que contenía mi grilla, y cada vez que se dispara, llama a grid.resize() . Simple, pero funciona.

Answer 2

Ponga agrega el DijitRegistry a la cuadrícula como se muestra aquí:

https://github.com/SitePen/dgrid/wiki/DijitRegistry

Coloque un Contenedor dijit en su panel de contenido (si el panel es necesario) y agregue la cuadrícula como elemento secundario del contenedor. El contenedor llamará a inicio en sus hijos, que también los redimensiona.

Answer 3

Problema resuelto. Entonces, mi problema fue: programáticamente agregué dgrid a dijit/layout/ContentPane . A través de otros navegadores funciona bien excepto IE 6. No mostró dgrid hasta que cambie el tamaño de la ventana de los navegadores. He utilizado muchas soluciones de y otros sitios. Hasta que no reemplacé la regla css para mi grilla (que se encuentra en una solución de Stacks).

En algún lugar encontré la siguiente regla de css:

#dataGrid {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: auto;
width: auto;
}

Está bien, pero no en IE6. Me cambiaron a:

#dataGrid {
width: 100%;
height:100%;
}

Y está bien ahora en todos mis navegadores de prueba. Espero que te ayude :) Totalmente agregando dgrid de trabajo (Dojo 1.9):

HTML (my container):
<div class="centerPanel" id="centerPanel" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region: ''center''" ></div> 

JS (I skipped reuires):
grid = new (declare([OnDemandGrid, DijitRegistry, ColumnResizer,Keyboard, Selection]))({
  columns: docListLayout,id:"dataGrid"
});
registry.byId("centerPanel").addChild(grid);

CSS:
#dataGrid {
width: 100%;
height:100%;
}

También eliminé CSS para mi CenterPanel con declaraciones de ancho / alto.

CU.