NestedSortable Widget


The NestedSortable Widget (from now on just widget) is a component that allows you to create a multi-columned table of entries that can be sorted and nested very easily by your user, using drag and drop, with full support for pagination.

It is built on top of the plain NestedSortable plugin and will, basically, do almost all the work you would have to do if you were to use the regular NestedSortable, as long as you provide it with a data source that will pass in your list of nested elements in JSON format. Given that list, it will build the HTML for the whole component, construct the NestedSortable and show visual clues as to when things are being loaded or saved.

The list items can have multiple columns, since the widget will draw your list in a way that looks like a table. The widget also has support for pagination of the list, both on the client (you don't have to show the whole list at once) and the server (you don't have to download the whole list at once). This can be a necessity when you are sorting a list with a large number of items. The widget code, perhaps surprisingly, is almost 3 times larger than the NestedSortable plugin's code. The good news is that all is already written for you and with it in your hands you will be able to create a list that can be sorted and nested by your user in no time.

You should check the demo, to really get a grasp of its main functionalities. Note that the data source used in the demo is a little stupid: it won't save the order of the elements, it will just pretend it did.

This widget, along with NestedSortable, was designed as part of a Google Summer of Code project for WordPress, in 2007, in order to provide a easy way for users to sort their pages. You can see it in action for WordPress in my blog.

Please, use the issue tracker at Google to report bugs.