Paging with a SpryNestedXMLDataSet

Question

I have created a page that functions as it should (without
paging)
HERE.
I've converted it to use PagedView
(page
here) and have got everything working - except the
NestedDataSet. I cannot seem to get the nested "photos" dataset to
set its row correctly. I've tried setrow on photos and features at
the same time, spry:setrow in the "photos" repeat region definition
of the TR and in the TD. None work. It simply just repeats the
same, 1st photo throughout the output.
Here's the code -
<div spry:region="pvFeatures features photos">
<table width="610" cellpadding="0" cellspacing="0">
<tr spry:repeat="pvFeatures" spry:even="even"
spry:odd="odd">
<td class="blurb"
spry:setrow="features"><strong>{title}</strong> -
{blurb}</td>
<td>
<table width="104" align="right" cellpadding="0"
callspacing="0">
<tr spry:repeat="photos">
<td class="caption"><img src="{photos::@path}"
alt="{photos::@caption}" title="{photos::@caption}"/><br
/>{photos::@caption}</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
Hope someone can help me get over this hump! Thanks,
Mark

Answer 1

Hi Mark,
We don't really have a good solution for paging nested data,
as you've discovered. The only solution for you I can offer right
now is something that goes like this:
- Replace your nested XML data set with this:
var photos = new Spry.Data.XMLDataSet("fg.xml",
"features/feature", { subPaths: "photos/photo" });
What this is basically doing is basically creating a table
join of the feature rows with the photo nodes, so you end up with
one row per photo, but it also includes all the feature data that
pertains to it.
- Change your markup that generates the photo table to this:
<table width="104" align="right" cellpadding="0"
callspacing="0">
<tr spry:repeat="photos" spry:test="'{photos::title}' ==
'{pvFeatures::title}'">
<td class="caption"><img
src="{photos::photos/photo/@path}"
alt="{photos::photos/photo/@caption}"
title="{photos::photos/photo/@caption}"/><br
/>{photos::photos/photo/@caption}</td>
</tr>
</table>
It's basically the same markup you had with 2 modifications.
First all data references that used to look like {photos::@caption}
are now {photos::photos/photo/@caption} to match the column names
generated by the join. Second, I added a
spry:test="'{photos::title}' == '{pvFeatures::title}'" to your
element that had the spry:repeat on it.
Ideally you would be comparing something like an id field,
but your <feature> node doesn't have anything like that on it
so I had to choose a field ... title.
--== Kin ==--