The widget is feature complete now

August 25, 2007

UPDATE: The plugin has now reached its 1.0 version, and is available in a compressed version and with documentation. Please check the project homepage at: http://nestedsortables.googlecode.com/

The widget is feature complete now and working well with the major browsers I have tested it (that is, FF2, IE7, IE6 and Safari 3). It took a little bit of hacking to remove the bugs in IE, but in Safari it worked like a charm the first time I tried it (and Safari is also the browser where it looks and feels faster – they probably have the best JavaScript interpreter out there). I changed a few things in the underlying Nested Sortable plugin, so it should be a lot faster now, in all browsers. The test demo can be seen here as usual and is now up-to-date with my latest SVN updates.

Serialization will, by default, send the data using POST and encoding the data using the “query string standard” , which most server side languages should automatically convert to their equivalent data structures for arrays and hashes. You can also configure the widget to return the data in JSON format (for that you need to include the JSON jQuery pluing) and process it in your server using one of the countless JSON libraries available. Following the REST principles under the HTTP protocol, if the HTTP response has a success code the widget will think data was saved correctly. You can even use the same server path (ie. the same script) to retrieve and save the data, since it will use GET to retrieve and POST to save.

I am aware that the “incremental” feature (showcased in the last example) does have a few problems when you change the item from one “page” to the next (even though you see things in a continuum , what you see is actually the different pages, each inside its own UL with a NestedSortable, being rendered in sequence). I am also aware there is a minor cosmetic issue with the spacing of columns in IE6. I am not much of a CSS browser quircks’ wizard and “incremental” shouldn’t be used in WordPress, I presume, so I am going to leave those issues to be solved after the Widget is integrated in WordPress.

If you find any other bugs or have more suggestions, please post a comment.



  1. Hi !
    Thanks for sharing this great work ! It’s really well done and look likes help me a lot/
    Unfortunately, it doesn’t work in local. I have downloaded the last version, but i still have the same message : “Could not load the data from the server.” -yellow-

    Could you please advice ? Do I Have to install something more ? (sorry, i’m little novice with JSon and JQuery)
    Thank you very much for your answer

  2. For the tests to work, you need to put them in a webserver (I recommend you to use WAMP for testing purpouses), because the datasource is a .php file.

    I created some reasonably complete documentation on the widget at the project wiki, I recommend you take a look there. If you still have some doubts/problems feel free to post other comments here\.

  3. Hello, I’ve been using your NestedSortable for a couple months now and I love it. Kudos on a great jQuery Plugin (and excellent documentation). You should make sure that the jQuery community knows about this, because I’ve seen people working on a ‘tree’ for the ui and other things that are like this. Make a post on the ui message group or something.

    I’m actually leaving this comment because I’m taking the application I’m working on to the next level and need to get more in depth into your plugin and probably the ui pieces beneath it. Please send me an email so we can correspond.

  4. Thanks for the nice feedback, Roger. I really didn’t had much time to divulge the plugins, I am currently a little busy finishing up some college tasks. After I am done with them I will send posts to the jQuery UI mailing list and maybe find some time to port this from interface to jQuery UI.

  5. Hi,

    First, thanks for this code !

    I’m trying to create a plugin for SPIP with the basic version of your nestedsortable list, not the widget, (couple with a treeview code to get a treeview with drag and drop). But, because of my poor skills in JS and jQuery, I don’t know how to do a “POST request” with the hash of the tree change (for example, when the user click on en button “save tree”). I don’t find on internet any solution. If you’ve got one, thanks a lot…

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: