Spry supports the notion of region states. That is, at any given time, a region is either loading data, ready to display the data, or in an error state because one or more of the data sets it is bound to failed to load its data. You can place a spry:state attribute, with a value of "loading", "error", or "ready" on elements inside a region container to associate it with a specific region state. Doing so can be quite useful for displaying a loading message as the data for a region loads, or notifying the user that the region failed to get its data. As the region changes states, it automatically regenerates its code and displays any elements with a spry:state attribute that matches the current state.

The following example uses the spry:state attribute to display loading and error messages:

<div spry:region="dsEmployees">
	<div spry:state="loading">Loading employee data ...</div>
	<div spry:state="error">Failed to load employee data!</div>
	<ul spry:state="ready">
		<li spry:repeat="dsEmployees">{firstname} {lastname}</li>
	</ul>
</div>

Any content that does not have a spry:state attribute on it, or is not a child or descendent of an element that has a spry:state attribute on it, is always included in the output when the code is regenerated. Also, children or descendents of an element with a spry:state attribute cannot have spry:state attributes. That is, nesting elements with spry:state attributes is not supported.