JS:SortedTable

published on
April 9th, 2006
by superego

SortedTable is a script that takes a valid table and makes it sortable and also allows you to move rows around. It’s mission is to be the foundation for widgets that do interesting stuff in the new wave of Web 2.0 applications.

Concept

SortedTable is trying to solve a very specific problem - sorting a table automatically (sort functions) or manually (move functions). Anything else is out of the scope and will not make it into the code. The idea of the evolution is to make the code leaner (smaller) but more useful. Any suggestions and contributions are welcome as long as they follow these simple rules. I’m not trying to create a widget. If I ever do it will not change the code of the SortedTable object.

History

0.8

  • first version that actually works on windows and has most of the needed features

0.8a

  • changed the behaviour of sorting:
    • axis=”string” now defaults to case insensitive smartcompare that puts 10 after 9, not after 1
    • no axis does normal compare (broken in 0.8)
    • axis=”sstring” added - does smartcompare case sensitively

0.8b

  • corrected a weird error that broke some sorts in ie6
  • added the possibility for a nonsortable column via class=”nosort” on the th cell
  • added the possibility to ‘regroup’ tbody elements if there’s more than one (for whatever reason)
  • added additional hook to put your custom javascript on (onsort)

0.8c

  • added additional hook to put your custom javascript on (onmove)

0.8d

  • added the option to allow only single line selects
  • corrected compare so that only strings enter compareSmart (error when trying to do split on a DOMElement)
  • changed parseInt to parseFloat for axis=number when sorting
  • changed compare - title now always overrides the value
  • added onselect that happens after onbodyclick

0.8e

  • corrected a bunch of small issues noticed while writing the documentation
    • added return true to selectRange (when it’s actually a range)
    • corrected prepHeader (callbacks on hover were broken)
    • removed redundant s_table variable from prepBody
    • moved onselect to the select method
    • added ondeselect
    • changed parameters to onsort and onmove
  • corrected a few sorting bugs
    • on axis=number NaN is now changed to Infinity to place nonnumeric values at the end
    • in smartcompare numbers go before text
  • corrected an error in the removeBeforeSort code (no nextSibling broke it)
  • added checking in prep so it cannot be done twice
  • added the option to disallow deselect

Future development

The next version will implement a Quicksort algorithm for sorting that will hopefully work a lot faster. It will allow the absence of header and axis properties for each cell that should make the html somewhat smaller.

Download

Check the SortedTable page here or just download the javascript.

Also worth reading

Opinions

  1. posted on
    April 10th, 2006
    by package this

    You need to package this better.

    Basically I have to find Events.js, and I really don’t know if I have the correct one, most like not, cause your code ain’t working in my setup yet.

    Thus you should make available whatever files I really need to run this.

  2. posted on
    April 10th, 2006
    by ego

    My apologees - you need to download the Event.js that is included in the example page. There is a reference in the header to a few versions that should do the trick though…

  3. posted on
    April 14th, 2006
    by Kevin Cornwell

    Love the script, check it out in action in my weather script…

    http://www.kevincornwell.com/weather/index.php

    Keep up the good work!

    -kc

  4. posted on
    April 14th, 2006
    by Aaron

    Is it just me, or is the example code now broken?

    Here’s what i’m seeing in FF 1.5.0.2 and IE 6.0.2900.blahblah

    In the top (first) table example, selections no longer highlight the way they once did. the highlight seems to be in effect though, because i can click move selected row(s) up after selecting the 2nd or 3rd record, and they will go up.

    After that, when i select say.. the second record and click move selected row(s) down, they do not move.

    In fact, as far as i can tell.. move selected row(s) down is entirely broken. I can only get records to go up.

    I really like this method, and would like to impliment such a thing for manually setting the order of database records.

  5. posted on
    April 15th, 2006
    by ego

    Thank you for the bug report. The code wasn’t broken, the example was.

    As you can see from the code of the sample links the first two use different code - they access the SortedTable object directly (mySorted) while the second two rely on finding it through a row in the table. Unfortunately when updating the example I forgot to add the id to one of the rows in the table which caused the problem.

    The highlighting issue was a CSS order problem - the odd/even styles were defined lower that the hover/selrow styles…

  6. posted on
    April 27th, 2006
    by Georges Bilodeau

    Nice job on the script, it works well. I noticed in your example that alternating rows have a different background color, but this functionality is implemented in the page’s JavaScript and not in SortedTable.js. I added a couple simple methods (based on the example) to the ‘helpers’ section of SortedTables.js to make it easier to set up these alternating row background colors:

    setRowClasses:function(r0, r1) {
    this.evenRow = r0;
    this.oddRow = r1;
    },
    colorize:function() {
    for (var i=0;i

  7. posted on
    April 27th, 2006
    by ego

    Georges I left the code outside of the object intentionally. Row coloring has nothing to do with sorting a table…

  8. posted on
    April 27th, 2006
    by Chris

    I really love the work you’ve done here - it’s very impressive and I’d be intereste d in using it myself, but unfortunately I’m a novice with Javascript. I’m sure you don’t want to walk a beginner through the use of your code, but I’d appreciate it if you could provide a link to a website that might have information available to use this kind of script, I’d be very grateful!

    Thanks!

    ~Chris

  9. posted on
    April 27th, 2006
    by Georges Bilodeau

    Yeah, good point on the row coloring ego. I did find one other thing. In the compareSmart function, a JavaScript error was popping up for me when comparing a cell with axis=string and innerHTML of length 0 (my table had some blank fields). Not a dealbreaker at all, but I changed the first two lines of compareSmart to fix it:

    v1 = (v1 && v1.length) ? v1.split(’ ‘) : [];
    v2 = (v2 && v2.length) ? v2.split(’ ‘) : [];

    That hopefully won’t break the code for anything else. Thanks for this handy script!

    Georges

  10. posted on
    May 4th, 2006
    by cynric

    Looks like a great replacement for my old js table sorter!
    i it possible if the to-be-sorted-column countains equal elements to keep the table “subsorted” after a main column? (described my prob here: http://tinyurl.com/jy8om )

  11. posted on
    May 5th, 2006
    by ego

    cynric this is actually an improvement I will think about when implementing a quicksort - you will be programatically able to sort as in excel - select columns and directions.

  12. posted on
    May 7th, 2006
    by Kilorf

    Hi superego,

    First i would like to thank you for this excellent script!

    Second i have had a couple of small issues when implementing it, nothing major so heres the fixes:

    - When sorting you use parseInt, instead of parseFloat, which makes it sort wrong in a commonly used situation.

    - using title param for dates are great, but i also need it for other types, for example currency columns where you might have prefixes ($) and different decimal, thousand seperators. This is also easily done, ive only hacked my own implementation for my own purposes, but a clean implementation should be quite obvious.

    Thanks again.

  13. posted on
    May 7th, 2006
    by ego

    I will change parseInt into parseFloat, good point. For the other thing - the title param always overrides the content of the cell when sorting so it can be used with no changes on any type of field. You can see this in the fourth line of the compare method. I will also add it to the examples…

  14. posted on
    May 7th, 2006
    by Kilorf

    Yes the title param overwrites the innerHTML value, but it doesnt seem to use the string, sstring, number logic, because the overwrite is part of the if-else.

    In my case it doesnt parse to float and js thinks its a string.

    My ugly hack:
    if (v1.title && v2.title) {
    if(axis==’number’) {
    v1 = parseFloat(v1.title);
    v2 = parseFloat(v2.title);
    } else {
    v1 = v1.title;
    v2 = v2.title;
    }
    }

    Or am i missing something?

  15. posted on
    May 7th, 2006
    by ego

    You are correct. I will change this in version 0.8d and release it in the next few days…

  16. posted on
    May 12th, 2006
    by Shayne

    Any news on the 0.8d release? not to be a pain in the ass, i just got a website project thats about to ship out the door and would like to do the small update.

    Thanks.

  17. posted on
    May 12th, 2006
    by Shayne

    I agree with Kilorf though, we need a money sorter :)

  18. posted on
    May 15th, 2006
    by Kashif

    A bit of documentation would certainly help :)

  19. mentioned on
    May 16th, 2006
    in johnnyvong.com

    links for 2006-05-16…

    SortedTable is a script that takes a valid table and makes it sortable and also allows you to move rows around. (tags: javascript ajax database webdev) SQLyog MySQL GUI is the most popular MySQL Manager and MySQL Admin Tool (tags: mysql database softw…

  20. posted on
    May 16th, 2006
    by İshak

    I want to sort a column which has numeric values,
    if a cell has non-numeric value (i.e, “” or “-”, which means data empty), sorting does not work properly.

  21. posted on
    May 16th, 2006
    by Pete

    Any odds on implementing support for multi-column sorting? That would make this even more awesome!

  22. posted on
    May 17th, 2006
    by Steve

    I’m rather new to javascript and am fumbling my way through this (great work by the way), what I would really like is the order # to dynamically change as it is moved up or down the list.

    If someone could provide me with the code to do this it would be appreciated

  23. posted on
    May 18th, 2006
    by Jeremy

    I can’t seem to make it sort a date/time column. I display the date and time a record was created and I use the title tag so the date properly sorts. Trouble is it sorts by time as a string instead of numeric. 10:00 pm comes before 7:00 pm and so forth. Any fix for this?

  24. posted on
    May 18th, 2006
    by ego

    Jeremy - you should put a iso date and time in the title. You’d get something like title=”2005-01-01T10:00:00″ and title=”2005-01-01T07:00:00″ that will sort as it should…

    Others - some errors are being corrected for the next release, money sorting can always be solved via correct title and axis (check examples), quicksort and multicolumn sorting is coming in version 0.9, the documentation and example for static row numbers (for Steve) is coming with 0.8e.

  25. posted on
    May 19th, 2006
    by Jeremy

    Thanks for the tip, ego. I realized my error shortly after I posted here. I have a new issue now. I have a column that contains numeric and alphanumeric values. I’ve tried sorting as string, sstring and number and it won’t put the numeric values ahead of the alpha ones. I also have a date column which either has a date or it is blank. It will sort the blank dates on top but won’t reverse and put the latest date at the top. I tried some logic to fill the title attribute with ‘1111-11-11′ if the date is blank but that’s not helping. Suggestions?

  26. posted on
    May 22nd, 2006
    by Jeremy

    Thanks for the update. I have one more question and I think my problems will be solved. Going into my page, my results are defaulty sorted. If I click the column that it is already sorted by it looks as though nothing happens. I have to click twice to swap the sort. How can I tell/fool the script into knowing what the table is already sorted by? Can I call the sort function after the table is drawn? How would I go about that? Thanks!

  27. posted on
    June 5th, 2006
    by Tiger Baiter

    I very much enjoy the script. I am trying to integrate it into an ajax page, and what I’d like to do is use it to update a database in realtime when a row is moved. What I’d like to do is a before and after snapshot of the table order so that I can pass that back to a function, or even just the old row number and the new. You get the picture. Is there any way of accessing these values?

  28. posted on
    June 5th, 2006
    by Tiger Baiter

    Update - have managed to get it to talk to the AJAX library. What I did was to use the nextSibling and previousSibling properties to extract an id value that match the database keys, then pass that back to the server.

    Will send you code when done.

  29. posted on
    June 21st, 2006
    by Joe

    Any idea when you’ll be releasing a version with multi column sort? I could really use that functionality.

    Thanks for a great tool!

  30. posted on
    June 26th, 2006
    by Ricard

    Hello, I’m not expert en javascript, and I don`t know how to do the submit of one kind of Array with the order of ’s after reordering the rows of my table with up/down buttons. I’m working with Struts and I need submit the new order as a parameter (in the request scope) or as a property of my ActionForm.
    Could anybody help me?

    Thanks in advance!!

  31. posted on
    June 27th, 2006
    by Eric Floehr

    Thanks for the awesome javascript!

    We are now using this sort Javascript for weather forecast accuracy detail tables at ForecastAdvisor.com. It works great!

    Just go to the site, enter in a U.S. city/state or zipcode, then click “Further analysis >>” at the bottom of the forecast page. This will bring up two tables showing weather forecast accuracy details of Accuweather, The Weather Channel, MyForecast, National Weather Service, etc. that are sortable by high temperature accuracy, low temperature accuracy, icon precipitation forecast accuracy, and text precipitation forecast accuracy, etc.

    Thanks again!

  32. posted on
    July 11th, 2006
    by Samn

    A great product - Thank you for publishing this.

    I am running into a challenge with table cells that contain hyperlinks. The cells are logically being sorted on the HTML preceeding the linked text, when it is obviously the linked text I want to be sorted.

    I would suggest a mode of the string axis type for hyperlinked strings, that sorted on the value between a pair of anchor tags.

    Thanks again!

  33. posted on
    July 28th, 2006
    by Samn

    A follow-up on my previous comment - While this may not be practical for very large blocks of text or HTML in a cell, you can still sort cells containing hyperlinked text by including the text in either the title of the link itself, or a bogus attribute. Using [a title="text" href="url"]text[/a] will allow you to sort by “data.” If you don’t want the text to appear redundantly as the title, you can make up a property like [a sortdata="text" href="url"]text[/a] . The rendering engine will ignore the property “sortdata”.

  34. posted on
    July 31st, 2006
    by Jon

    I love your script!

    However, I’m having a problem that’s really holding me back. I have a column of checkboxes (which is not sortable) and a column of strings. When I sort the table by the column of strings, the checked=”checked” status of the checkbox column resets in IE. The state is maintained properly in Firefox, however. Any ideas?

  35. posted on
    August 12th, 2006
    by Georges

    thank you for this beautiful script.
    I also have a question which i can’t answered. I was looking for sorting table rows but to order a menu so I’d like to know if it was possible to but dynamic vas in array.

    More explications.
    I have a menu which contains title and subtitles. They are all written in a table on my page. What i would like is to move rows to put a dynamicaly position that i’m writing in my DB MySQL later. (select * FROM titles ORDER BY ‘position’)

    The position is given by a value in my input field (as I have no input in my table in will be an hidden field in my td)

    2 would become
    2

    4 = number of the title id number and 3 which is the line number. If I move it up 4 should stay and 3 should become 2.

    I hope someone would understand me and if we can do this, I hope it would be useful for someonesle.

  36. posted on
    August 18th, 2006
    by Dallas

    Any fix for the issue Jeremy was having? I’m having the same problem:

    —————————————-
    Jeremy said,

    on May 22nd, 2006 at 07:36

    Thanks for the update. I have one more question and I think my problems will be solved. Going into my page, my results are defaulty sorted. If I click the column that it is already sorted by it looks as though nothing happens. I have to click twice to swap the sort. How can I tell/fool the script into knowing what the table is already sorted by? Can I call the sort function after the table is drawn? How would I go about that? Thanks!

  37. posted on
    August 18th, 2006
    by ego

    You should check the first table on the examples page. You can achieve this by setting a class name of ’sortedplus’ or ’sortedminus’ on the header cell.

  38. posted on
    October 5th, 2006
    by Brady

    I noticed that when I put links in the cells the script does not sort correctly. Is there a way to have links?

    Great work by the way.

  39. posted on
    November 16th, 2006
    by Josiah

    There seems to be a bug in sorting decimal values. See example: http://www.climate.washington.edu/precipranking/table.php?location=qulPcpMO

  40. posted on
    December 8th, 2006
    by Don Lapre Fan

    Yes, I am also having problems in sorting the required table properly. It would be so nice if you can help me.

    Don Lapre Fan
    webmaster@j-ams.org
    http://www.j-ams.org

  41. posted on
    December 11th, 2006
    by ego

    It’s really easy - the axis parameter defines what kind of compare will run on the data in the cell. If you want the compare function to use something else than the value in the cell you can specify that in the title attribute to the cell and it will use that instead.

    For all the possible values check the examples page. I will expand the home page to include some instructions…

  42. posted on
    December 16th, 2006
    by garry

    i’m pretty much new to javascript so you’ll forgive me if this seems like an obvious problem.

    i’m tring to add new rows to a table which will ‘inherit’ the same behaviour as other rows in the table which were added without javascript. unfortunateley, when i do this, the rows which are added donot move up and down as the other rows. is there a quick fix for this?

    here’s the extra code that i’ve added to SortTables.js:

    insRow2:function(elm){
    this.cleansort();
    var tbl = elm.parentNode;
    var lastRow = tbl.rows.length;
    var newRow = tbl.insertRow(lastRow);
    var td0 = newRow.insertCell(0);
    var td1 = newRow.insertCell(1);
    var td2 = newRow.insertCell(2);
    td0.innerHTML=”NEW CELL1″;
    td1.innerHTML=”NEW CELL2″;
    td2.innerHTML=”NEW CELL3″;
    },

    SortedTable.insRow = function(elm)
    {
    var st = SortedTable.getSortedTable(elm);
    if (st) st.insRow2(elm);
    }

    which is called like so:

    thanks for the help.

    garry

  43. posted on
    December 22nd, 2006
    by Josiah

    The axis parameter did the trick. Though a couple of columns that have the same type of numbers work without the axis parameter and do not work when the proper axis parameter is included.

  44. posted on
    December 25th, 2006
    by Martin

    I think there is a bug in the “move specific row down” function on the demo site. It always moves row 1, no matter what row is selected.

    /mac

  45. posted on
    December 26th, 2006
    by ego

    Martin - ‘move specific row down’ means you specify the row element you want to move. To move the selected row(s) you omit the secont argument to the move function (check the javascript link as you hover over it).

  46. posted on
    January 22nd, 2007
    by REW

    There seems to be a bug in sorting values when an xslt format-number with a thousands separator is added. If some values are in the hundreds and some values are in the thousands, the sort does not work correctly. When the values are all in the thousands, the sort works fine. When I remove the comma in the format statement it works fine.

    TIA

  47. posted on
    January 22nd, 2007
    by ego

    When using different formated numbers the idea is to add the sortable value to the title attribute of the table. Check the examples page for this (the second table solves this issue) - 1,222,345

    - the script will automatically use the title value to sort the element. You can also use the title element for sorting prefixed numbers (eg. $12).

  48. posted on
    February 27th, 2007
    by randy

    When using large numbers such as the following, it does not seem to sort properly:

    58,896,341.0405
    58,896,341.0405
    158,891,355.078
    68,276,005.7803
    68,276,005.7803
    41,125,489.678

    I downloaded the events and sorttable.js files and updated the HTML like the examples mentioned but when using simple numbers it was fine.

    Is it possible, something that I am missing will correct this? It is a very good script otherwise.

  49. posted on
    February 28th, 2007
    by ego

    randy, if you’re using delimiters with numbers you should add a title to the cell:

    58,896,341.0405

    This will tell the script to use the title instead of the content when sorting.

  50. mentioned on
    April 9th, 2007
    in outbreak » The first year (written on April 9th, 2007 by Marko Mrdjenovic)

    [...] JS:SortedTable [...]

  51. posted on
    May 30th, 2007
    by ionut

    Hi,
    I must say your script is great! One issue though: I can’t make the table rows alternating after I sort it(I have two class=”odd” rows consecutive). Any idea why is that?

  52. posted on
    May 31st, 2007
    by abstinent

    Hello, Marko, it seems to me that for xml island tables the script still does not works. Something happens, however, the table blinks… but no sorts…
    Can you help me?

  53. posted on
    June 3rd, 2007
    by Brian

    I am playing with the move from table to table portion of the script. The first table (s) needs to be sortable, however, I don’t want table (d) or the second table to sort. How could I accomplish this? I see the sort data in the sortedtable.js. If I remove, both tables become unsortable (I know why). I suppose I need some code to bypass the sorting if indicated. But how? I’m somewhat new to JS, too.

    Thanks for the wonderful script. It’s very very cool!!

    Brian

  54. posted on
    June 12th, 2007
    by Steve

    My page at http://www.stevelim.com/links/friends_links.html seems to work correctly for firefox, but does not sort in IE.

    Any ideas?

    The data in the tables are php generated and non-static, if that has any bearing on it.

    Thanks,

    Steve.

  55. posted on
    June 12th, 2007
    by Steve

    I also wanted to add to my post above that the IE error I get is this..

    Line:103
    Char: 3
    Error: ‘this.body’ is null or not an object
    Code: 0

    Thanks,
    Steve.

  56. posted on
    June 12th, 2007
    by ego

    I’m sorry it took me so long - I’ve been sorting out some personal stuff. I hope it’s not too late and I can help you all now…

    ionut - most probably you don’t have the colorize function attached to the correct events on the SortedTable objects.

    abstinent - can you give me an example? I haven’t worked with XML data islands a lot - I had a case when writing the script and it seemed to work back then. A change in the script might have changed that…

    Brian - ideally what you would do remove the sorted value from the class attribute from the destination table and change the moveRows so that it would only move the selected rows. If you want to use the whole function I would suggest commenting out the line with d.sort(); in it.

    Steve - the first thing to do is get rid of a lot of JavaScript. The script tag you copy-pasted from the examples page should only read:
    <script type=”text/javascript”>//<![CDATA[
    onload = function() {
    mySorted = new SortedTable();
    }
    </script>
    If it still breaks let me know, I don’t see anything wrong with the HTML.

  57. posted on
    June 12th, 2007
    by ego

    Steve - the last line should of course be:
    //]]></script>

  58. posted on
    June 13th, 2007
    by Steve

    ego,

    Thanks for replying.

    I replaced the huge script snipped from your example with the following..

    //

    Good news is.. there are no more errors in IE.
    Bad news, it stops sorting (working) completely in all platform/browsers.

    Steve.

  59. posted on
    June 13th, 2007
    by Steve

    The working code is as follows..

    //

    I was missing the var sourceTable;

    Also worthy of note is that in Samn’s post -

    “If you don’t want the text to appear redundantly as the title, you can make up a property like [a sortdata=”text” href=”url”]text[/a] . The rendering engine will ignore the property “sortdata”.”

    The above works great for FF but not IE. I had to use eg. title=”texthere” for IE to play nice.

    Thanks again,
    Steve.

  60. posted on
    June 13th, 2007
    by Steve

    Sorry to keep adding comments. But I realized that the hack that Samn posted about sorting hyperlinks does not work completely with IE. Only with FF. Even with bogus attributes or title tags added to fool the sorting.

    If anyone finds a solution, let me know.

    Steve.

  61. posted on
    June 13th, 2007
    by Steve

    Ok. More digging I have discovered a bug with trying to use hyperlinked text with the sorttable.

    Basically in IE only there is this problem with single word text vs. phrases with spaces (2 or more words). They are not treated or sorted in the same way.

    If you mix hyperlink text of single words with multiple words, IE sort gets ‘confused’. You can test this and see a problem.

    My ugly hack is to add a ‘ .’ at the end of the single word text data for urls.

  62. posted on
    July 13th, 2007
    by Mark

    I integrated your example table into my application, and it works just fine. However, when I put the table in a backend .php file and then use XMLHttpRequest() to bring in the table, it brings and displays the table just fine, but does not sort. It is just a normal table.

    I’m new to javascript and ajax, and so probably need help where I shouldn’t if I knew better what I was doing. Any ideas?

    Thank you
    Mark

  63. posted on
    July 15th, 2007
    by Mark

    I solved my own problem. Your onload function I made into a function I call once the data has been loaded.

  64. posted on
    August 4th, 2007
    by Mark

    I’m continuing to work with this. My ignorance is with DOM. I’ve given the tag an id matching the key in my database. Within the moverows() function, how would I capture the id of the moved rows so that I could then update the database?

  65. posted on
    August 4th, 2007
    by Mark

    Previous entry unclear. It is the TR tag that has the id=372 or whatever the keyfield of the database is.

  66. posted on
    August 5th, 2007
    by ego

    Firstly I think that you need to have a letter for the beginning of the id (HTML spec).

    To see what is going on in s move function you can add an event handler (it’s called onmove). It will be called with the same parameters as the move function, so you can easily add database functions.

  67. posted on
    August 7th, 2007
    by Mark

    Thanks ego for responding. I am moving rows from one table to another, as in the last part of your Examples page. I found the function moverows() in your sample code. Any reason that isn’t in the documentation page yet?

    It is moving rows fine, and I can capture the id of the row I need by looking at the selectedElements I am moving.

    Now, I am working through an error I’m getting in the line :
    // var tds = elm.getElementsByTagName(’td’);
    even when the code is purely from the example page. It was working, I think. It is saying that line “is not a function”. I’ve eliminated whitespace, having researched and found discussion of the phantom node issue.

  68. posted on
    August 7th, 2007
    by Mark

    I wish I could edit a post here. Meant to ask “Why isn’t moverows() part of your sortedtable.js”?

  69. posted on
    August 8th, 2007
    by Mark

    Steve,

    Attempting to chase down a problem I’ve having, I pared your Example page down to the bare essentials to play with Moving Rows from one table to another.

    I’m getting a real oddity. If I change the Destination table’s id from ‘d’ to anything else, the destination table sorts once and quits. I can change the id of the source table with no problems. Email me for sample pages URL if you want. I’m changing the name three places : the new SortedTable(), the CSS, and the id of the table itself.

  70. posted on
    August 12th, 2007
    by ego

    I’ve only added the moving rows to examples to show that the script works with live data. It’s a thing that doesn’t actually has anything to do with sorting…

  71. posted on
    August 13th, 2007
    by Mark

    Ego. For some reason, I thought your name was Steve. My question of August 8 regarding changing the name of tables is directed to you. I tried it with your full Example page too. I changed the name of the destination table at the end from “d” and it stops working. - thanks Mark (PS. Can you email me, I have a private question.)

  72. posted on
    October 24th, 2007
    by Ronhead

    hi
    ive a big problem..

    how i can center rows with numbers?
    i cant do its, i use and

  73. posted on
    October 30th, 2007
    by Daniel

    Great script!

    I added it to a project with a dynamic table from a database and each time I sort the table, a cookie is updated with the column title and sort direction. The reason is to remain the sorted column when visit the page next time. Works great!

    Just one thing, when using IE6 or 7 with a large number of rows (more than 100) the performance while scrolling in the table with the mouse wheel is very week. It’s the same with the examples if I copy paste a few hundred rows more. But I have no such problem when using FireFox.

    Is it related to the possibility of selecting rows and can I get rid of the selctions because I don’t use it?

  74. posted on
    October 31st, 2007
    by Daniel

    I guess it wasn’t so difficult after all
    “//this.prepBody();”

  75. posted on
    January 18th, 2008
    by Musa

    hi
    when you release a new version of sortedtable.
    And i have same problem with Daniel. But i use mouseover function. When i disable this.prepBody(); line said so Daniel, everyhings work fine. But can you fix this problem another way?

  76. posted on
    February 13th, 2008
    by secret1029

    Hi, Could this javascript be used with mysql ?

  77. posted on
    February 26th, 2008
    by Chris

    I have an example table that is currently sorting incorrectly because it is comparing initial whitespace characters to alpha characters–sort by the Notes column and “Inactive” will precede “Crazy”:
    http://osric.com/chris/javascript/sort-table/sort-table.html

    I saw in the documentation that there is a trim(str) helper function, but I’m not sure how to best to hook it in to the rest of the code. Any advice?

    For now I’ve just been more meticulous about keeping extraneous whitespace out of my code (which is probably for the best anyway!) but comparing trimmed strings may be a useful option to include.

  78. posted on
    April 3rd, 2008
    by Bob

    BIG BUG!!!
    If you dynamically delete some row, such problems arose:
    1) In Opera: after sort, deleted rows come back
    2) In IE: after sort, Javascript throws Invalid Pointer exception.
    To correct this in sort function add: this.parseCols():
    if (!elm) return false;
    this.parseCols(); // add this row!!!

  79. posted on
    June 2nd, 2008
    by Bandzula

    I have 2 table on page. Function colorize work only with first table. I need alternate colors on second table too.
    Help please !!

  80. posted on
    June 2nd, 2008
    by ego

    The colorize function is only an example. Ideally you would create a function that would apply it to all the sorted tables - the example code only applies it to a single table.

  81. posted on
    August 14th, 2008
    by srinadh

    When am using the above sorting function for multiple function and calling the script externally am not able to reverse the order of rows after sorting is done for the first time….

    Help me out…………………

Express your opinion

My name is Marko Mrdjenovič and I’m a web developer and a manager from Ljubljana, Slovenia (N 46° 03.246,W 14° 30.265).

I work at Parsek Zemanta, I’m a WaSP ILG member and I’m also the program lead at local weekly talks Spletne urice.

Blog archive

Advertisments

Jobs

Come in, we're hiring

Full-time and freelance job opportunities available at Authentic Jobs:

Post a job and reach web professionals everywhere.