No Results Found
No Results Found

Reputation: 102745

jQuery UI sortable not serializing with custom attributes

I'm using jQuery UI sortable with data-id attributes. I know you can use sortable('serialize') with something like id="row_4" and this does work for me but I need to do it this way.

<div data-sortable="link/to/handler">
    <div data-id="1">1</div>
    <div data-id="2">2</div>
    <div data-id="3">3</div>
    <div data-id="4">4</div>
    <div data-id="5">5</div>
</div>
var container = $('[data-sortable]');
container.sortable({
    items : "> [data-id]",
    update : function() {
        var postData = container.sortable('serialize', {
            attribute: 'data-id'
        });
        alert(postData); // Nothing
        var postData2 = container.sortable('toArray', {
            attribute: 'data-id'
        });
        alert(postData2); // 1,3,4,5,2 etc.
    }
});

Fiddle: http://jsfiddle.net/ogzw5pL2/

What's the deal? I'm 98% certain this was working before.

Upvotes: 3

Views: 3152

Answers (2)

Julien Gr&#233;goire
Julien Gr&#233;goire

Reputation: 17124

You need key and value for serialize, but you can play with parameters to override default behavior and get wanted results.

In your case you can set the attribute, key and expression you want so that it takes the data-id and build the string with defined key and proper value. Like this:

           var postData = container.sortable('serialize', {
                attribute: 'data-id',//this will look up this attribute
                key: 'order',//this manually sets the key
                expression: /(.+)/ //expression is a RegExp allowing to determine how to split the data in key-value. In your case it's just the value

            });

Fiddle: http://jsfiddle.net/c2o3txry/

Upvotes: 6

Pointy
Pointy

Reputation: 413737

The "serialize" method just does not work if you don't have id values of the form "something-n". (You can use _ or = instead of -.)

The idea is to give you a query string that's got the "something" as the parameter name and the values after the - as the values.

Upvotes: 1

Related Questions