Question

So, I’m using the nestedSortable plugin and I need to send the data back to a rails application using the “awesome_nested_set” gem. I would like to use the serialize function built into the nestedSortable plugin, but I don’t understand how to use it.

When I try to view the source with firebug on the plugin’s site, I can’t seem to find where the “serialize” demo takes place, so I just assumed that this is how it would work, but it doesn’t:

$(document).ready(function() {
    $('ol.sortable').nestedSortable({
        disableNesting : 'no-nest',
        forcePlaceholderSize : true,
        handle : 'div',
        helper : 'clone',
        items : 'li',
        opacity : .6,
        placeholder : 'placeholder',
        revert : 250,
        tabSize : 20,
        tolerance : 'pointer',
        toleranceElement : '> div'
    });
    $("#send").click(function(){
        var data = $("ol.sortable").serialize();
        alert(data);
    });
});

Thanks for any help!

Answer 1

I found out how it works, so I’ll post the answer for those of you who were as confused as I was when first using this.

First of all, you’ve got to make sure that your <li>‘s each have an id in the form list_number. For example:

<ol class="sortable">
  <li id="books_1"><div>Oryx and Crake</div></li>
</ol>

Second, and this is what confused me the most because I guess I haven’t used plugins enough to see this sort of thing, the serialize function is called this way:

$('ol.sortable').nestedSortable('serialize');

This may have been really obvious to many, but I didn’t know about it, and if you didn’t either, hopefully this helps!