Question

What is happening in below jQuery code ?

$("#myDiv").val($(".cssValue").sortable('serialize',{expression: 'textExp[#]'}));

I understand its enabling sortable on a css value within a div, I’m open to correction on this.

I’m confused about this section:

'serialize',{expression: 'textExp[#]'}

Answer 1

I understand its enabling sortable on a css value within a div, I’m open to correction on this.

.sortable('serialize',{expression: 'textExp[#]'}) is actually the jQuery UI syntax for invoking a method on a previously instantiated jQuery UI widget. That is to say, this line isn’t actually making .cssValue sortable – that was done at a previous point in time. This command simply serializes the element.

Here’s a full run down:

// select an element with id='myDiv'
$("#myDiv")
    // note: .val() is used for setting the value of form fields, so this doesn't
    // seem to make a lot of sense, given that #myDiv is presumably a div
    .val(
        // select an element with class='cssValue'
        $(".cssValue")
            // call the serialize method on this jQuery UI sortable element
            // this will return a serialization of .cssValue - check out
            // the methods tab here http://jqueryui.com/demos/sortable/
            .sortable('serialize', { expression: 'textExp[#]'})
    );