Render don't display header

[jdgrieco]

If I call myGrid.render() when container's display style is set to 'none' all data is normally rendered, but header is not. Is this the correct behavior?

part of my code:



<div id="grid_example" style="display: none; height: 150px;">
</div>

<script type="text/javascript">

var myColumns = [
{header: "Col 1", width: 200, sortable: true},
{header: "Col 2", width: 400, sortable: false},
{header: "Col 3", width: 75, sortable: false}
];
var columnModel = new YAHOO.ext.grid.DefaultColumnModel(myColumns);

var myData = [
[1,2,3],
[2,3,4]
];
var dataModel = new YAHOO.ext.grid.DefaultDataModel(myData);

var ExGrid = new YAHOO.ext.grid.Grid('grid_example', dataModel, columnModel);

ExGrid.render();

document.getElementById('grid_example').style.display = 'block';
</script>


tks, those extesions are remarkables!

[jack.slocum]

Rendering with display:none can potentially cause a lot of problems. Especially in the new version. The grid does measuring/positioning internally and with display:none, those measurements aren't available.

If you want it hidden before render, you should use visibility:hidden.

[jdgrieco]

TKS, again.

I'll try.