Adobe Spry
- June 20, 2007 12:28 PM
- Javascript
- Comments (0)
The first step in Spry is declaring a data set, and while Spry and grown to use several different data types as possible datasets, the basic is still XML. Click Here to check out the XML file I'll be using for these examples.
<script type="text/javascript" src="../../includes/xpath.js"></script>
<script type="text/javascript" src="../../includes/SpryData.js"></script>
<script type="text/javascript">
var dsCDs = new Spry.Data.XMLDataSet("/uploads/cd_catalog.xml", "/catalog/cd");
</script>
Above is a basic declaration of a new XML Data Set named dsCDs. The first input to the XMLDataSet constructor is the URL to a XML dataset, although the file need not end with .xml, in fact the target only needs to return valid XML to be used for a data set, and thus URLS like "/gallery.cfm?galleryID=2" are perfectly valid. This can also become increasingly important once you begin to declare dynamic data set URLs, but thats probably outside the scope of this brief write up. The second input is the XPath to the elements that you wish to include in your data set. Attributes and children of XML nodes selected by the given XPath query will be available in your data set, so in this case I can access the title, artist, country, company, price, and year of each CD in the catalog.
Now that we have a data set, it time to put it use it.
<body>
<ul spry:region="dsCDs">
<li spry:repeat="dsCDs">{dsCDs::artist}</li>
</ul>
</body>
What does that mean? Well the first section,
...
<ul spry:region="dsCDs">
...
</ul>
...
Declares that this is the area of the page that will be used to display the data set you've imported. The HTML within the region will be evaluated to determine the placement of values out of the dataset.
The second spry attribute usage,
...
<li spry:repeat="dsCDs">...</li>
...
Is used to tell spry that it needs to repeat that element and its children for each row in the data set. Without this tag, the <li> element would only be processed once, and thus only the first element row from the data set would be shown.
Lastly, the inner part of the <li> tag,
...{dsCDs::artist}...
Is used to tell Spry what value you want displayed, in this case the value of the XML node <artist>. Since we told Spry to repeat the <li> round this value for each row in the data set, this value will be found once for each data set, and thus produce an element in the list for each artist in the XML file.
Well, thats not a terribly useful example, and there is a lot more to Spry, but that should get you up and running if you want to play with it.
