Detect the display size for paging
Hi,
I am trying to implement the pagination with XML data source in AW 2.0.1. Instead of setting a fixed width and height, I'd like to see my grid in a fluid layout mode. That is, the grid should grow and shrink (both width and height) based on the document's real estate. (BTW, does min-width, min-height in CSS work for grid to setup minimum size?)
Here comes my question. If the document size changed, I need to calculate the new display size for the grid to render. Does it mean I have to set the fixed row height and manually calculate it by myself to decide how many rows can be rendered in the new grid size and fetch the data for those rows? Is there an easier way than that?
Another question is that when I manually adjust the grid size by setting the css property of the grid (document.getElementById('mygrid').style.height = adjustHeight();), it works perfectly in Firefox, but in IE, especially in IE6, it hangs. The simple code snippet is like the following:
HTML
<script type="text/javascript">
function adjustSize() {
document.getElementById('myGrid').style.height = [calculate the height...] + 'px';
}
</script>
<body onload="adjustSize()" onresize="adjustSize()">
...
<div>
<script type="text/javascript">
var grid = new AW.UI.Grid;
grid.setId('myGrid');
....
document.write(grid);
</script>
</div>
...
</body>
Any idea? Thanks in advance for your helps.
I am trying to implement the pagination with XML data source in AW 2.0.1. Instead of setting a fixed width and height, I'd like to see my grid in a fluid layout mode. That is, the grid should grow and shrink (both width and height) based on the document's real estate. (BTW, does min-width, min-height in CSS work for grid to setup minimum size?)
Here comes my question. If the document size changed, I need to calculate the new display size for the grid to render. Does it mean I have to set the fixed row height and manually calculate it by myself to decide how many rows can be rendered in the new grid size and fetch the data for those rows? Is there an easier way than that?
Another question is that when I manually adjust the grid size by setting the css property of the grid (document.getElementById('mygrid').style.height = adjustHeight();), it works perfectly in Firefox, but in IE, especially in IE6, it hangs. The simple code snippet is like the following:
HTML
<script type="text/javascript">
function adjustSize() {
document.getElementById('myGrid').style.height = [calculate the height...] + 'px';
}
</script>
<body onload="adjustSize()" onresize="adjustSize()">
...
<div>
<script type="text/javascript">
var grid = new AW.UI.Grid;
grid.setId('myGrid');
....
document.write(grid);
</script>
</div>
...
</body>
Any idea? Thanks in advance for your helps.
Lance
July 3,