Forums

I want to set up a DataTable that scrolls both horizontally and vertically. But I want the Height of the table to be set up on load time based on the available height of the browser. I am trying to override the doBeforeLoadData() to do this, but I am not having much luck. I am a beginner to YUI and I am just taking the examples and expanding them. Any help would be greatly appreciated.
Thank you

To enable scrolling just set your height or width (or both).

If you want to set the height based on the viewport, then use getViewportHeight in the DOM collection.

You can put this into your actual table definition like so:

myDataTable = new YAHOO.widget.DataTable("container", columnDefs, dataSource, {
scrollable:true,
height: (YAHOO.util.Dom.getViewPortHeight()) + "px",
width:"100%",
initialRequest: EventViewer.requestBuilder(),
formatRow: EventViewer.rowFormatter
});


You'll need to subtract something from the viewportheight to make it look nicer, just experiment with different values.

Or you can set the height after rendering the table, remembering that data is fetched asyncronously so it should be quick enough to not see the original height:

myDataTable.set('height', (YAHOO.util.Dom.getViewPortHeight()) + 'px');

That should do you, if your table is inside a layout object you need to use something else, so let me know if that is the case.

Also if you have hybridised your code to have 2.x and 3.x functions, the 3.x getViewPort is slightly different.