DataTable Widget :: Scrolling

Sample Code

CSS:

/* custom css*/ #scroll {margin:1em;} #scroll table {border-collapse:collapse;} #scroll th, #scroll td {border:1px solid #000;} #scroll th {background-color:#696969;color:#fff;}/*dark gray*/ #scroll .yui-dt-odd {background-color:#eee;} /*light gray*/

Markup:

<div id="scroll"></div>

JavaScript:

var myColumnHeaders = [ {key:"areacode"}, {key:"state"} ]; var myColumnSet = new YAHOO.widget.ColumnSet(myColumnHeaders); var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.areacodes); myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY; myDataSource.responseSchema = { fields: ["areacode","state"] }; var myDataTable = new YAHOO.widget.DataTable("scroll",myColumnSet,myDataSource,{scrollable:true});