Spry * Create a Spry HTML data set

Open a new or existing HTML page.

Make sure that you’ve linked the Spry data library files to the page. For more information, see Prepare your files.

Locate the HTML source for the data set.

For example, you might want to use the “datatable1” table from a file called datatable.html. The file might be located in a folder called data in the site’s root folder:

data/datatable.html

You could also specify a URL to the HTML file, as follows:

http://www.somesite.com/somefolder/datatable.html

Note: The URL you decide to use (whether absolute or relative) is subject to the browser’s security model, which means that you can only load data from an HTML source that is on the same server domain as the HTML page you’re linking from. You can avoid this limitation by providing a cross-domain service script. For more information, consult your server administrator.

To create the data set, insert the following script block after the script tags that import the library:

<script type="text/javascript">
	var datasetName = new Spry.Data.HTMLDataSet("sourcefile", "tableID");
</script>

A completed statement might look as follows:

<script type="text/javascript">
	var ds1 = new Spry.Data.HTMLDataSet("data/datatable.html", "datatable1");
</script>

The statement creates a new data set called ds1 that retrieves data from the “datatable1” table in the specified HTML file. The data set has a row for each tr tag in the table, and columns to hold the items in each td tag.

You can also specify a URL as the source of the data, as follows:

var dsSpecials = new Spry.Data.HTMLDataSet("http://www.somesite.com/somefolder/datatable.html", "datatable1");

Note: The URL you decide to use (whether absolute or relative) is subject to the browser’s security model, which means that you can only load data from an HTML source that is on the same server domain as the HTML page you’re linking from. You can avoid this limitation by providing a cross-domain service script. For more information, consult your server administrator.

The completed example code might look as follows:

<head>
...
<script type="text/javascript" src="includes/SpryData.js"></script>
<script type="text/javascript" src="includes/SpryHTMLDataSet.js"></script>
<script type="text/javascript">
	var ds1 = new Spry.Data.HTMLDataSet("data/datatable.html", "datatable1");
</script>
...
</head>

(Optional) If the values in your data set include numbers, reset the column types for the columns that contain those numerical values. This becomes important later if you want to sort data.

To set column types, add the setColumnType() data set method to the head tag of your document, after you’ve created the data set, as follows (in bold):

<script type="text/javascript">	
	var ds1 = new Spry.Data.HTMLDataSet("data/datatable.html", "datatable1"); 	
	ds1.setColumnType("price", "number");
</script>

In the example, the expression calls the setColumnType method on the ds1 data set object, which you’ve already defined. The setColumnType method takes two parameters: the name of the data set column to retype (in this example, "price") and the desired data type ("number").

Spry

Create a Spry HTML data set

document.write(terms_Related_Information);