|
Hi, I've just incorporated your Javascript into a database-driven JSP page. As long as there are just 50 or so rows, all works reasonably well. However, around 100-200 rows the sorting takes a significant amount of time: 10 or 20 seconds per column on my PII-400 w/392MB of RAM. Around 500 rows or more the browser doesn't even finish completely loading but rather it locks up, eating up my CPU and RAM. The former problem might be taken care of using a more robust sorting algorithm, the latter problem seems to reflect on initTable() itself.
I don't mean to 'rain on your parade'. It's a nice application. You seem sincere about wanting to keep improving it. If I can help I will. I probably won't have time at work, but I want to write an advanced Javascript book, and this could provide an interesting case study.
|
|
|
|
|
I have 3 different implementations posted at my web site:
http://www.geocities.com/sc_hanyu/javascript/sorttable.html
The one posted at codeproject uses delete/insertCell to redraw tables and that takes a long time. As for sorting algorithm, I agree that there could be a way to improve it, but what I do is pretty simple using generic algorithm provided by Javascript, so things should be ok. As for locking up your computer, I'm not sure what's happenning. It could very well be the script ... 
Don't worry about 'rain on your parade'. I don't mind. I'm also here to learn new stuff and expriment with different technology. So, as far as I'm concerned, I welcome any comments both positive and negative.
Regards,
- Han
http://www.geocities.com/sc_hanyu/
|
|
|
|
|
Wow, this is an awesome piece of work. I just realized that IE 5 has a whole bunch of new features, functions, etc... NN6 also has a whole bunch of new stuff but they went too overboard that they forgot to be backward compatible... things that used to work on NN4x no longer work on NN6, so NN in my opinion is out of the game. IE is the Undisputed Heavyweight Champion of the Browser Wars!! Not only because the Javascript engine is so much better, and not only that its the only browser capable of handling XML, ActiveX, Automation, blah blah blah... but finally, it handles HTML errors gracefully and allows for full controll of such errors (the error handling kicks ass).
Well, im probably starting to annoy you so ill say my farewell and congradulate you for such a magnificent piece of work.
MoMad the NoMad
|
|
|
|
|
Yeah, the browsers have come a long way ... and IE has come even longer way.
I was really glad that the code worked at first try on Netscape after a minor
adjustment. If it didn't, I really would have not known what to do.
It would have been quite challenging to develop/debug the code for Netscape.
In any case, thanks for your generous comments.
- Han
http://www.geocities.com/sc_hanyu/
|
|
|
|
|
Hi there, this piece of code is really good,
but it doesn't sort the amount column properly ,
so I need some advice like how to sort a column containig amount which has data like ---- 1.200.00 , 4,889,888.00
|
|
|
|
|
Hello,
I haven't tested with those particular formats ... but the key is
in the function compare. As you can see, I'm also handling date as
special data with isDate function to determine whether the inputs are
both Date format. You can do the similar thing with these types of
data ... First, you need to figure out how you can compare and then
you need to modify compare function so that if both inputs are of
this type, it does the right thing.
Hope this helps.
Good luck.
- han
http://www.geocities.com/sc_hanyu/
|
|
|
|
|
having the same problem with the numerical sort
checkout
http://www.rosefame.co.uk/torrevieja/apart.html[^]
its a property site with porperty prices on it and since the prices do not share the same number of characters in them, they do not sort correctly.
An ascending order sort give the prices with the least number of character ie <1000 which is fine, then the greatest values ie >over 100,000 and then sorts the rest.
please advise, im not a javascript programmer so an answer in plain english would be great
Neil
|
|
|
|
|
http://javascript.internet.com/messages/check-sorter.html
http://www.romankoch.ch/capslock/tablesort.htm
Adrian Bacaianu
|
|
|
|
|
I tried this script on one of our pages. VERY NICE!
It appears, however, you use the "Simple Table Model" to determine the headings.
We use the "Complex Table Model" which adds the <THEAD> and <TFOOT> and puts the <TH> in those sections.
The <TFOOT> headings get sorted with the data even though they are between the <TH></TH>.
I'd like to keep the footers. Any suggestions?
Ive included a sample below.
<table id="table0" border="6" cell padding="4" cellspacing="1"
bgcolor="#00FFFF" bordercolordark="#008000" bordercolorlight="#00FF00" style="FONT-SIZE: x-small">
<thead>
<tr>
<th>Coil</th>
<th>Location</th>
<th>Mill Area</th>
<th>DateTime Into Inventory</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center">248089</td>
<td align="center">S2708L</td>
<td align="center">HCS</td>
<td align="center">2002-03-10 19.34.40</td>
</tr>
<tr>
<td align="center">265588</td>
<td align="center">S0511L</td>
<td align="center">HCS</td>
<td align="center">2002-02-24 08.50.34</td>
</tr>
<tr>
<td align="center">277423</td>
<td align="center">S8901L</td>
<td align="center">HCS</td>
<td align="center">2002-02-24 02.27.16</td>
</tr>
<tr>
<td align="center">280175</td>
<td align="center">S2003L</td>
<td align="center">HCS</td>
<td align="center">2002-02-28 00.47.59</td>
</tr>
<tr>
<td align="center">286938</td>
<td align="center">S2405L</td>
<td align="center">HCS</td>
<td align="center">2002-03-09 05.56.07</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Coil</th>
<th>Location</th>
<th>Mill Area</th>
<th>DateTime Into Inventory</th>
</tr>
</tfoot>
</table>
|
|
|
|
|
Yeah ... good question.
Well, the quick and dirty solution is to let the script assume that the last row is the footer  I don't know at the moment as to how I can treat these tags properly. I'll have to look into this.
In the meantime, if you are up for quick/dirty solution, then you can simply change a line in the initTable:
Look for the line in initTable method:
for (var i=0; i
|
|
|
|
|
Han,
I had to change the "for (var i=0; i<nRow; i++)" in sortTable as well.
I was wondering if it would have been better to change "nRow = table.rows.length;" to
"nRow = table.rows.length - 1;" in initTable.
I am new to the world of JavaScript and haven't taken the time to learn how to write it yet, so bear with me when I ask questions.
One thing I see with both table models is the use of <TH> for true heading behavior. SO, when examining the table object, can rows with the <TH> be identified or is that lost once the table is generated?
The issue of the <THEAD> and <TFOOT> could be helpful, especially if you want to trigger the sort from either, but because of the simple model, the <TH> is not restricted to those areas. As I see it, the <TD> is really meant for the cell data.
You may just want to establish a few more rules for the use of this script.
Fred
|
|
|
|
|
Yup. Changing the table length will also do that job.
Yeah ... you have many good suggestions. I think it's time to make the script a bit smarter I'll see what I can do ... hopefully I can have something soon.
Thanks for your feedback!
- han
|
|
|
|
|
Hi there, this piece of code is really cool,
but I need some advice --> I got tables with
Dates in the following format : 12 Nov 2001
12 Jan 2001
12 Dec 2002
Your code doesn't work that cool on these !
Please I need your help !
ZDragon
|
|
|
|
|
Hi,
The sorting routine uses the literal string ... so the date data won't work ... In order to make it work, you will need to make some changes to the code. Here is one of the ways.
Look at the function "compare". As you may notice, the function is used to compare 2 inputs (i.e. a, b) and returns which one should is "bigger" (in sorting sense). I tried to take care of simple number inputs and strings (see the if statements with isNaN etc). You can write a few lines of code to handle date types. Javascript has Date objects which you can use to compare (<, >, = operators), so all you need to do is to:
1. First find out whether the inputs (a, b) are date types
2. If they are date types, create Date objects
3. Then, do the compare and return the results
There may be many ways to do this, but I'd probably modify the lines:
if (aToBeCompared < bToBeCompared) ...
to be something like:
if (isDate(a) && isDate(b)) // note you need to define isDate
{
// I HAVE NOT TESTED THIS CODE !!!
// convert a, b to date objects
Date aDate(a);
Date bDate(b);
// compare using date objects comparison operators
if (aDate < bDate)
if (!descending)
return -1;
else
return 1;
else if (aDate > bDate)
if (!descending)
return 1;
else
return -1;
return 0;
}
else
{
if (aToBeCompared < bToBeCompared) ...
no changes here ...
...
...
}
Hope this helps ... the most difficult is probably writing isDate as you need to account for all sorts of date format inputs. It may be sufficient to use Date constructor to see if it's in date format that Javascript recognizes. isDate is a function that determines whether a string input is in date format or not. It returns true if it's a date format, false otherwise. There may already be such function in Javascript
- Han
|
|
|
|
|
Hi
Thanx for the help,
I will let you know if there is
any other problems !
Thanx !
ZDragon
|
|
|
|
|
The latest should handle this ...
- Han
|
|
|
|
|
If you reverse the dates it sorts well. 2002-09-04 (y-m-d) you can also include year only and year circa eg 2001 c.
eg http://home.vicnet.net.au/~cerberus/crew.html#index
John Rogers
www.cerberus.vze.com
|
|
|
|
|
I was able to run the script on IE5, but not on IE6. The table captions do not turn to links onmouseover in IE6.
|
|
|
|
|
Hello ...
I just downloaded the sources and tried it using IE 6.0.2600.0000
on Windows 2000 and it worked for me. I'm not sure why it's not
working for you at the moment ...
I've posted a few different implementations at my homepage ...
so perhaps you can give it another try with the ones posted there.
http://www.geocities.com/sc_hanyu/javascript/sorttable.html
Let me know how it goes.
- Han
|
|
|
|
|
I found this code very cool, useful, and easy to use. Congratulations!
|
|
|
|
|
Thanks for your geneour comments ... Since I wrote this script, I learned so much about how difficult it is to cater to all sorts of different random inputs (different table formats, browser versions etc). I'm still improving the script but I don't think it will end anytime soon ...
- Han
|
|
|
|
|
Thank you very much for the script! It's really the best one on the net...
Also probably the only good one who's also Netscape-compatible.
The new update is really good, it's only a pity that it's a little bit slower, but it remains still very good.
Thank you!;)
WN
|
|
|
|
|
No problem ... I'm also disappointed with the performance when
used with medium to large size tables. I plan to take a closer look at the implementation once I get a chance.
Anyways, thanks for your generous comments!
BTW, you can also find the latest script at my homepage at
http://www.geocities.com/sc_hanyu/javascript/sorttable.html
I pretty much introduce a few features here and there.
- Han
http://www.geocities.com/sc_hanyu/
|
|
|
|
|
Han,
Thanks for posting such a nice piece of work! I wrote a multicolumn list (grid view like) "scriptlet" which augments an HTML table with such things as row selection, methods for getting selected row data, etc. I ran into a problem trying to integrate your sorting code and would like to ask your help.
Problem: I am also storing custom attributes off of the elements of my table. When I am manipulating the DOM for my DHTML work I set attributes (e.g., currentRow.setAttribute("selected", true) ) on the elements. I noticed that the sort does not "move" these attributes. Thus, my hidden data stays in the original ordinal position of the table rows before the sort.
Any ideas on how I could modify the sortTable.js code to also swap any attributes what have been associated with the elements?
Thanks,
Joe Scheer
Russell/Mellon Analytical Services
|
|
|
|
|
Hello Joe
In addition to using insert/deleteCell for all the cells including the title cells, I've added a few more lines of code to retain certain cell properties (i.e. align). The latest script also simulates by centring and bold-facing the title cell contents.
Hope things are working okay for you. If not, let me know.
You can also get 2 other old implementations at my homepage:
http://www.geocities.com/sc_hanyu/
Thanks.
- Han
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
