Reordering Items in a Listbox
By Chris

Manipulating HTML forms is one of the easier areas of cross-browser scripting. How to allow users to reorder content inside of a listbox. This technique works in Netscape Navigator 3.0 and Internet Explorer 4.0 and later. Unfortunately, this technique won't work in Internet Explorer 3.0 because IE3 does not support manipulating listbox contents .

Reordering items with a listbox is easy. We create two buttons or links that when clicked and move the selected item up or down in the list using javascript. We also added support for cycling so you can quickly move items from the beginning to the end of the list - a useful feature on longer lists.

Reordered 4, 1, 2, 6, 3, 5....



Clicking the Submit New Order button sends the results to our server. On the server, we process the list regenerating the listbox in the new order.