"HTML data sets work the same way as XML data sets, except that [they] can leverage the millions of tables that already exist," stated an Adobe spokesperson. "Since we flatten XML into a table structure, the HTML data set was a natural extension of the Spry Framework."
According to Adobe, the Spry framework was designed in such a way that the data acquisition methods are independent of content contained within the <body> tag.
"This means that the Spry region attributes don't care where the data comes from, be it XML, JSON or HTML," the Adobe tech added. "The universal familiarity with HTML tables makes the learning curve of developing a Spry data source very easy."
Functionally, the HTML data set allows standard HTML tables to be used as data sources, as long as the table has an ID attribute to identify the data source. To use a table as a Spry data source, you must call two JavaScript files: SpryData.js and SpryHTMLDataSet.js, and then below those script links, build a data set constructor such as var yourDataSetName = Spry.Data.HTMLDataSet("path to file with table", "id of table");
This is all that's needed to create a data set, but there are additional options that dramatically open up the possibilities for programmers.
In use, the data values pulled from an HTML table include the contents of each <td>, such as text and markup. Headers are used to define the column names, with a default assumption that the first row of the table is column names to be used as data reference names within Spry regions. If the first row is actually data, then this can be specified and changed. There is also the option of using the first column instead of the first row to provide column names.
Adobe recommends that designers use straight tables without rowspans or colspans as data sources, since these elements merge cells together and can lead to data inconsistency.
The power of the Spry HTML Data Set goes far beyond its use of standard tables as data sources, however, to include the ability to use CSS to identify parts of a web page to be used as data, or indeed, to use data pulled from any markup element on the page.
The creative as well as time saving possibilities of this technology — especially for users wanting to upgrade legacy designs that rely on static HTML tables — make Spry HTML Data Sets a handy tool worth investigating more closely. Try it for yourself and see if it eases your development chores. You can learn more by visiting Adobe Labs.
