Geek post today. I have developed a cross-browser JavaScript class that adds drop-down “shufflers” to a table which will allow the user to change the order of the rows in the table on the fly.To use it, set up your table to it has an empty column in it to hold the shufflers. By default, this will be the first column in the table, but you can designate a different column if you want. You can either set shufflers on the whole table or on its tbody element. Either way, you’ll need to give the table or tbody element an ID. Assuming you keep this class in its own file and then load that file into your page, after the page loads (i.e., you might want to use the window.onload() event), all you need is one line of code:
var my_table = new Shuffle_Table([’my_table’, ‘my_tbody’]);
In this example, the JavaScript variable controlling the shuffle-table is my_table, and the ID containing the table rows is my_tbody. Note the arguments passed to the Shuffle_Table() constructor is actually an array. The arguments (”args”) are:
- args[0] => (string) the name of the variable to which this particular instance of Shuffle_Table() is assigned
- args[1] => (string) the ID of the TABLE or TBODY element containing the rows to which shufflers will be assigned
- args[2] => (integer) (optional) a zero-based numeric index indicating which column will contain the shufflers; default is 0, for first column
- args[3] => (string) (optional) the shufflers will have consistently-named unique IDs, which it can generate on its own, but if you want you can designate the prefix for those IDs; this is generally unnecessary
I hope you find this useful. To download, right-click here and select “Save File As…” or “Save Target As…”.