Forum Moderators: open
He created a class called "sortbottom" for rows which contain data such as totals so that they'll always be placed in the bottom row. But he didn't create a class called "sorttop" or "static" for those rows that aren't the top row but should remain in place rather than getting sorted. I want to make a row sortable that isn't the first one, though it's still a header.
BTW, I got the (x)html/css from Elderweb.com's excellent When You Absolutely, Positively Need a Table [elderweb.com]. It's valid code and very useful... but it would be more useful if I could get the sorttable to support my code.
I've tried a number of things, none of them even close to successfully. Any ideas would be greatly appreciated.
[edited by: tedster at 11:21 pm (utc) on Dec. 12, 2003]
[edit reason] sorry, no links to your own sites [/edit]
In Safari, the sort feature doesn't do anything. In IE the whole page (apart from the LHS menu) fails to render - and then behaves erratically when you scroll down/up. Works as expected in Netscape but non-functional in Opera.
Both IE and Opera show the error: "Handler could not be removed".
Anyway, what's the largest table you've tried it on? Will it accomplish its task in a reasonable amount of time on a table of say, fifty or 100 rows with 15 columns?
Tom
I used a similar piece of Javascript once -- very, very similar -- right down to creating the arrays for sorting purposes and I can confirm that tables of any size (read: dynamic data from a table which is managed by the user) will cause an error message in the browser. If I remember correctly, it was IE and a message popped up during page load stating it had run out of memory or something like that and asked if you wanted to continue loading the page. You could say, OK, which loaded the page, but you couldn't sort, or you could click Cancel which stopped loading the page and left incomplete data displayed. I had to scrap the plan and go to server-side control. Just giving you a heads-up.
BTW, Welcome to WebmasterWorld, abc3!
1. As I mentioned above, sorttable.js assumes that you'll want to use the first table row as the one that controls the sorting:
function ts_makeSortable(table) {
if (table.rows && table.rows.length > 0) {
var firstRow = table.rows[0];
}
if (!firstRow) return;
// We have a first row: assume it's the header, and make its contents clickable links
for (var i=0;i<firstRow.cells.length;i++) {
var cell = firstRow.cells[i];
var txt = ts_getInnerText(cell);
cell.innerHTML = '<a href="#" class="sortheader" onclick="ts_resortTable(this);return false;">'+txt+'<span class="sortarrow"> </span></a>';
}
}
Most of the time this would be fine. But for complex (though valid) tables like the ones at Elderweb (linked above, but here's a more specific link to an actual table)...
Beautifully designed table [elderweb.com]
...things break down because, logically, you want to sort based on the second row of <th> cells, not the first.
I've been experimenting with the code, but haven't found anything that actually works. If anyone has a suggetion--or a solution--I'd love to read it.
2. The other problem raised by sorttable.js is really more of a javascript issue, so I didn't mention it the first time around. Strings of digits with recursive commas, e.g.
1,234,567,890
4,567
9,456,900
are strings and sorted alphabettically (as I understand it), not by the "absolute value" of the "numbers." The above list is in order, according to javascript's default sort order.
Sorttable.js includes "type" identification in its code, including currency, numeric, and date, but it doesn't have a type that can handle "numbers" with recursive commas.
(This is all better explained by Dr Stockton [merlyn.demon.co.uk].)
So I sort of understand the problem but I haven't been able to solve it. Again, I'd love to see any suggestions or solutions.
P.S. The Mac unfriendly page is by sorttable.js's author. My guess is that he'll fix it soon. It's a new design and he seems like someone concerned with standards.
SN
A small list ofregexes should identify most datypes properly
I thought so, too. The script's author has organized the script in this way:
// Work out a type for the column
if (table.rows.length <= 1) return;
var itm = ts_getInnerText(table.rows[1].cells[column]);
sortfn = ts_sort_caseinsensitive;
if (itm.match(/^\d\d[\/-]\d\d[\/-]\d\d\d\d$/)) sortfn = ts_sort_date;
if (itm.match(/^\d\d[\/-]\d\d[\/-]\d\d$/)) sortfn = ts_sort_date;
if (itm.match(/^[£$]/)) sortfn = ts_sort_currency;
if (itm.match(/^\s*-?[\d\.]+\%?\s*$/)) sortfn = ts_sort_numeric;
I thought I'd be able to pinch code from Dr Stockton as follows...
if (itm.match(/^(.*\s)?([-+\u00A3\u20AC]?\d+)(\d{3}\b)/) sortfn = ts_sort_recursive_comma_numeric;
...and that it would have the added benefit of looking for the dollar and pound sign, but it doesn't seem to work properly. Though even when I find a matching type, I'm not able to constuct code that will strip the commas, sort the numbers, and then put the commas back into the strings.
The idea of giving a row a class/id is also covered in the original script -- (id="sortbottom") is used here:
// We appendChild rows that already exist to the tbody, so it moves them rather than creating new ones
// don't do sortbottom rows
for (i=0;i<newRows.length;i++) { if (!newRows[i].className ¦¦ (newRows[i].className && (newRows[i].className.indexOf('sortbottom') == -1))) table.tBodies[0].appendChild(newRows[i]);}
// do sortbottom rows only
for (i=0;i<newRows.length;i++) { if (newRows[i].className && (newRows[i].className.indexOf('sortbottom')!= -1)) table.tBodies[0].appendChild(newRows[i]);}
Again, the problem I have is in implementing the model for sortbottom given how the rest of the script is constructed. Any help would be greatly appreciated.
