Displaying data
In this recipe, we will use the DataSource object that we prepared from our HTML table in the previous recipe. We will use it as the basis for a new DataTable control, and we will begin to see the enhancements that this control affords.
We now have a DataSource object available, we can move on to creating the actual DataTable control. This example builds on the previous recipe, adding additional code to the existing JavaScript. However, it should be clear that the DataSource we built in the previous recipe may be substituted for any other (for example, a DataSource built from data retrieved from an XML web service).
How to do it...
Open the datatable.js
file from our previous recipe, and add the DataTable definition code as highlighted, after the data source has been defined. The file contents should then match the following:
YUI().use("yui2-datatable", "yui2-paginator", function(Y) { var YAHOO = Y.YUI2; var dataSource = new YAHOO.util.DataSource(YAHOO.util.Dom. get("cooktable...