We have the a grid inside a table (containing a button row) which is inside a div. The div is added to a layout cell as shown below.
What I would like to see is that the contents of cell “c” fill the available space. If the user resizes the layout bar or the browser window, then the contents would adjust. The grid should have scroll bars if the size is too small.
What we’re seeing is that I must set a fixed size (e.g., 100px) for the div containing the grid. If I use percentage of say “90%” then it doesn’t show at all. I have seen other forum posts regarding setting the parent container’s height, and have tried this, but the contents of the grid are not scrollable so it pushes the “button” off of the screen unless you resize the layout cell manually.
Is there a way to have the contents of the cell auto size such that if the browser or layout size changes, it will always fill the area and add scroll bars if necessary?
ruleHistoryLayout.cells("c").attachObject('auditHistoryFormDiv');
try {
ruleHistoryDetailGrid = new dhtmlXGridObject('auditHistoryDetailGrid');
ruleHistoryDetailGrid.setEditable(false);
ruleHistoryDetailGrid.setDateFormat("%m/%d/%Y");
ruleHistoryDetailGrid.enableResizing("true,true,true,true,true,true,true,true,false");
ruleHistoryDetailGrid.init();
ruleHistoryDetailGrid.setSkin("light");
ruleHistoryDetailGrid.setStyle("", "", "", "background-color:#fff8e2; border-color:#5286c8; border-width:1px;");
ruleHistoryDetailGrid.enableAlterCss("even", "uneven");
} catch (e) {
alert('[2c]Unable to set up rule history detail tab: '+e);
}[code]
[/code]