Spry 1.2 Samples

In this section, we provide samples that feature small examples of a specific behavior in the Spry Framework. These are designed to provide insight into building Spry applications. Feel free to use these code examples in your own work. Check the source code to see what's happening.

Spry Data Set and Dynamic Region Samples:

Data Set Explorer - A great file. This sample accepts a path to your source XML file. It shows the schema as a tree. Clicking the tree node will show the resulting data set and provides the full code to create the data set. A nice way to visualize your data set. It also allows for testing the new POST support in Spry.

Hiding Data References - This is an example of how to hide the data references used inside of spry:region and spry:detailregions as the page loads.

Combining Spry Attributes - This sample shows you how you can combine some of the processing instruction attributes to eliminate the need for using extra wrapper elements.

Debugging Generated Region Markup - This sample shows you how to turn on region debugging to see what template code is being processed and what markup is being generated.

Regions States Sample - This sample shows you how to use region states to specify when markup in dynamic regions should be shown.

Data Set Observer - This sample shows you the two ways you can register observers on a data set.

Setting the Current Row- This file shows how the current row can be set by the user. Remember that Spry has a zero based counting system!

Region Observer Sample - This is an example of how to register a Spry region observer function to perform an action whenever a region is finished updating.

Non-destructive Filter Sample - This file shows off the new non-destructive filtering capabilities. Typing a state name will filter the data. Backing out the text field will return the data.

Sort Sample - We have improved sorting support. We now sort ascending, descending and toggle. We also support multiple column sorts. This example shows these capabilities.

Even/Odd Row Sample - This sample shows you how to use the built-in {ds_EvenOddRow} data reference to color even and odd rows of a table.

spry:select and spry:selectgroup - Spry:select and selectgroup allows users to highlight a data record on a click or other event. Different than hover, the select persists until the next event. Spry:select allows for one selection at one time. Selectgroup allows for multiple selects.

Paging Sample - This is an example of how to page through a dataset, 10 records at a time. Handy for large datasets, or when design constrains the data area.

Filtering with XPath - Data set constructors can take XPath expressions to filter or otherwise restrict the data in the dataset. Check the source to see what's happening.

XML String Sample - This is an example of how to create an XML data set from an XML string.

Non-XML Based Data Set - This is an example of how to manually insert data into a non-XML data set so that it can be used with Spry regions.

Progressive Enhanced Version of the Products Demo - In working towards progressive enhancement and javascript disabled environments, spry:content allows for Inner HTML replacement and static content at the same time. This makes designing for non scripting environments much easier.

Auto Suggest Sample - An example of using a Spry region and non-destructive filter to create an auto suggest widget.

Zuggest Sample - Very similar to the Auto Suggest Sample above, but the content is styled so that it appears as a set of results like Zuggest.

Spry Widget Samples:

Accordion Sample - An example of how to style accordions differently on the same page.