Posted in | Posted on 12-18-2008 | 3,403 views
A reader wrote in asking an interesting question. He was using a Spry PagedView (a nice way to present a 'paged' interface to data loaded in via Ajax) and ran into an issue when trying to display the row number. When he used {ds_RowNumberPlus1}, the row was relative to the page. So on page 2, he saw 1 instead of 11. I read over the docs a bit and nothing seemed like it would work. I then created the following demo to help me test this.
2
3<head>
4<script src="http://localhost/Spry_1_6_1/includes/xpath.js"></script>
5<script src="http://localhost/Spry_1_6_1/includes/SpryData.js"></script>
6<script src="http://localhost/Spry_1_6_1/includes/SpryPagedView.js"></script>
7<script>
8var mydata = new Spry.Data.XMLDataSet("data.cfm","/people/person");
9var pvdata = new Spry.Data.PagedView(mydata, { pageSize: 10 });
10
11var myFilterFunc = function(dataSet, row, rowNumber) {
12
13 if(Spry.$("keyword_filter") == null) return row;
14 var regExpStr = Spry.$("keyword_filter").value;
15
16 if(regExpStr == '') return row;
17 var regExp = new RegExp(regExpStr, "i");
18
19 if(row["name"].search(regExp) != -1) return row;
20 return null;
21}
22mydata.filter(myFilterFunc);
23
24</script>
25</head>
26
27<body>
28
29<form name="filterForm"><input type="text" name="keyword_filter" id="keyword_filter" onkeyup="mydata.filter(myFilterFunc);"></form>
30
31<div spry:region="pvdata">
32
33<div spry:state="loading">Loading - Please stand by...</div>
34<div spry:state="error">Oh crap, something went wrong!</div>
35<div spry:state="ready">
36
37<p>
38
39<table width="500" border="1">
40 <tr>
41 <th onclick="pvdata.sort('name','toggle');" style="cursor: pointer;">Name</th>
42 </tr>
43 <tr spry:repeat="pvdata">
44 <td style="cursor: pointer;">
45 ds_RowID={ds_RowID} ds_RowNumber={ds_RowNumber} ds_RowNumberPlus1={ds_RowNumberPlus1}<br/>
46 ds_PageFirstItemNumber={ds_PageFirstItemNumber} ds_CurrentRowNumber={ds_CurrentRowNumber}<br/>
47 <b>{name}</b></td>
48 </tr>
49</table>
50</p>
51</div>
52
53<div id="pagination">
54 <div id="pagination" class="pageNumbers">
55 <span spry:if="{ds_UnfilteredRowCount} == 0">No matching data found!</span>
56 <span spry:if="{ds_UnfilteredRowCount} != 0" spry:content="[Page {ds_PageNumber} of {ds_PageCount}]"></span>
57 </div>
58 <div id = "pagination" class = "nextPrevious">
59 <span spry:if="{ds_UnfilteredRowCount} != 0">
60 <a href="javaScript:pvdata.previousPage()"><< Previous</a> |
61 <a href="javaScript:pvdata.nextPage()">Next >></a>
62 </span>
63 </div>
64</div>
65
66</div>
67
68
69</body>
70</html>
The code behind the XML was rather simple:
2<people>
3<cfloop index="x" from="1" to="100">
4 <cfif randRange(1,10) lt 3>
5 <cfoutput><person><name>Sam #x#</name></person></cfoutput>
6 <cfelse>
7 <cfoutput><person><name>Person #x#</name></person></cfoutput>
8 </cfif>
9</cfloop>
10</people>
11</cfsavecontent>
12<cfcontent type="text/xml" reset="true"><cfoutput>#str#</cfoutput>
Once this was done, I quickly ran the demo and saw that there seemed to be no built in variable that would work. The closest thing I saw was that {ds_PageFirstItemNumber} represented the first row of the current page, and if I added ds_RowNumber, together I got a proper value.
Ok, so long story short, I whipped up a quick function to handle the addition:
2 return parseInt(lookupFunc("{ds_PageFirstItemNumber}")) + parseInt(lookupFunc("{ds_RowNumber}"));
3}
And then added this to my display: {function::FormattedRowNum}
This worked fine, both before and after I applied a filter. However, I figured I was missing something and I pinged the Spry team. Kin wrote me back and suggested I use {ds_PageItemNumber} instead. That worked perfectly! The reason I had not tried was due to the description:
The unfiltered item number for the current row being processed. This is the unfiltered row index of the row plus one.
I guess when I saw "unfiltered", I figured it wouldn't work with a filtered dataset.
I guess I forgot to update the description after that fix. I'll correct the description in that sample so it doesn't lead people astray.
Thanks it really works
@Kin
I think thats why i didn't read it on Spry examples LOL, i'll wait for 1.7 release for updated examples :D