How do you make the height of a Dojo DataGrid change based on it contents -

i understand in order grid display parent div needs specific height. grid shrink or grow in height depending on number of rows.

the following give grid max height of 300px shrink if there couple of rows displaying.

parent div

var divgrid = domconstruct.todom("<div id='divgrid' style='height:300px;'></div>"); domconstruct.place(divgrid, dojo.byid('contents')); 

create grid

var grid = new datagrid({    id: 'grid',    store: store,    structure: layout,    style: "height:300px",    loadingmessage: "loading...",    nodatamessage: "no data...",    selectionmode: 'single',    rowselector: '20px' }); grid.placeat(divgrid); grid.startup(); 

now after grid loaded

dojo.connect(grid, '_onfetchcomplete', function() {    var list = query('#grid .dojoxgridcontent');    var height = list[0].offsetheight + 25;  // additional 25 account headers    if (height < 300) {       dojo.byid("divgrid").style.height = height + 'px';       dojo.byid("grid").style.height = height + 'px';       grid.resize();       grid.update();    } });