TargetOrder by Simon Plenderleith

JavaScript ordered lists without the pain of drag 'n' drop

About TargetOrder

I developed TargetOrder as an alternative to drag 'n' drop web interfaces for ordering tables of data. TargetOrder is intended to be a lightweight, unobtrusive, cross-browser and efficient solution to this.

Responsive user interface
Great for ordering long tables
Totally unobtrusive - no nasty inline JavaScript and minimal additional markup required
Output - save instantly with AJAX or retrieve data on-request to save via AJAX or alternative method (e.g. regular POST)
Easy to customise and hack

Demos

View 'Favourite Film List' Demo
A few more demos coming soon...

Download

The simple usage instructions are included in a readme file in all downloads.

Browser Compatibility

TargetOrder should work fine in earlier versions of all the browsers listed below. Unfortunately I haven't had the time to test TargetOrder on all platforms in lots of different browser versions. If you fancy letting me know if it works on a platform/browser/browser version that isn't listed that'd be appreciated.

TargetOrder has been tested and works in the following browsers:

IE 6 and above (PC)
Firefox 1.0.7 and above (PC / Mac)
Mozilla 1.7.12 (PC)
Opera 7.54 and above (PC / Mac)
Safari 2.0 and above (Mac)
Camino 1.0.2 (Mac)
Flock 0.7.1 (Mac)
OmniWeb 5.1.3 (Mac)

Thanks to Alistair for helping me with browser testing.

Bug Reporting, Feedback & Comments

I've tested TargetOrder as much as I can, so hopefully there will be few if any bugs, but if you do come across any please let me know. Any feedback or comments are also very welcome too!

License

TargetOrder is licensed under a Creative Commons Attribution 2.5 License.

Credits

The core code was developed by myself, but there are a few terribly handy functions that I've used to help things along:

getElementsByClassName function by Robert Nyman
$ function from the Prototype library
addEvent function originally by Scott Andrew
Event target detection code by Peter-Paul Koch
Extra DOM functions (_firstChild, _lastChild, is_all_ws, is_ignorable) based on code from Mozilla Developer Center
Fade Anything Technique (FAT) by Adam Michela
2-way arrow created from famfamfam.com icons