Sorting problem with simple dataset

Question

I'm new to spry, but even so I have to think I'm just missing
something stupid here. The script is below ... basically just added
an onclick to each of the column headers in a table that sorts by
that column. Whenever I actually run it though, it always sorts by
the first column, Rank. What am I doing wrong?
<div spry:region="reportData">
<table border=1 cellspacing=2 cellpadding=2>
<tr>
<th
onClick="javascript:reportData.sort('Rank','toggle');">Rank</th>
<th
onClick="javascript:reportData.sort('Player','toggle');">Player</th>
<th
onClick="javascript:reportData.sort('Team','toggle');">Team</th>
<th
onClick="javascript:reportData.sort('Bye','toggle');">Bye</th>
<th
onClick="javascript:reportData.sort('Games','toggle');">Games</th>
<th
onClick="javascript:reportData.sort('Average','toggle');">Average</th>
<tbody spry:repeatchildren="reportData">
<tr>
<td>{@Rank}</td>
<td><a
href="javascript:makeWin('rosters.pl?PlayerId={@PlayerId}', 400,
600 );">{@Player}</a></td>
<td>{@Team}</td>
<td>{@Bye}</td>
<td>{@Games}</td>
<td>{@Average}</td>
</tr>
</tbody>
</table>
</div>

Answer 1

The first arg to the sort method is the name of the column to
use. I see from your data refs that your column names actually
begin with @ characters, so you have to make sure you pass the same
thing to the sort method:
<th
onClick="javascript:reportData.sort('@Rank','toggle');">Rank</th>
<th
onClick="javascript:reportData.sort('@Player','toggle');">Player</th>
<th
onClick="javascript:reportData.sort('@Team','toggle');">Team</th>
<th
onClick="javascript:reportData.sort('@Bye','toggle');">Bye</th>
<th
onClick="javascript:reportData.sort('@Games','toggle');">Games</th>
<th
onClick="javascript:reportData.sort('@Average','toggle');">Average</th>
--== Kin ==--