Spry newbie here, so maybe I'm doing something wrong but, I created a small XML data file and then an HTML file to display the XML data in a sortable table. So far, so good -- If I click on any column header, the table is sorted by the data in that column. Now, I want the column header background color to change, as a visual indication of the column that was sorted. I added an onclick=... to call a function to change the background color. The line looks like this:
<th id="col1" spry:sort="last" onclick="hilite('col1')">Last Name</th>
When I click on the column header, nothing happens. But if I change 'onclick' to 'onmouseover' instead, then the function works, as expected. Or, if I leave it as is and temporarily delete the 'spry:sort' then the header changes color (but of course the sort no longer works). About all I can guess is that there's some sort of conflict between having 'spry:sort' and 'onclick' in the same line.
Thanks for any help on this,
The spry:sort refreshes the whole region, so when you click the button and mighlight a element inside the region it could be erased by the region refresh.
Thats why Spry is using observers events. http://labs.adobe.com/technologies/spry/articles/data_set_overview/ind ex.html take a look at that. And especially the DataSet observers.
"The spry:sort refreshes the whole region, so when you click the button and mighlight a element inside the region it could be erased by the region refresh."
Thanks! I hadn't thought of that. I'll go back to re-read the DataSet observers stuff, but for the moment I came up with a fairly-simple workaround: I created an identical table header outside the spry:region div tags, then positioned it over the table header in the Spry table. So, now my function calls change the background color of the new table header, and this doesn't get erased when the table is refreshed.