jQuery UI sortable not serializing with custom attributes

Question

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.

sortable('serialize', {attribute: 'data-id'}) gives an empty string
sortable('toArray'), {attribute: 'data-id'}) gives expected output

<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.

I can y ou pleas aadd the code in the ventialator for the demo?IBM try card punches or AssembleyQuery like jQueru for Assembly and binary for more speed thnaks and hope is benefits well — stormdrain
– stormdrain, Commented Nov 13, 2017 at 16:52
@stormdrain its is passing nmp and bowser test currantly but i try to compile for LAMP stack and get error 72 the file you specified is inspecified plese restat your brower so i think it is asm error? can u link to the gist or send friend request on codepan? i have thousands dollars of cliants with many subscriebrs sir who relying on this — No Results Found
– No Results Found, Commented Nov 13, 2017 at 17:05

Julien Grégoire · Accepted Answer · 2015-08-05 17:52:40Z

6

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/

answered Aug 5, 2015 at 17:52

Julien Grégoire

17.2k4 gold badges34 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

No Results Found Over a year ago

Thanks for the workaround, this will do. I can't change all the templates but I have no problem adjusting one javascript file.

Pointy · Accepted Answer · 2015-08-05 17:46:29Z

1

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.

answered Aug 5, 2015 at 17:46

Pointy

415k62 gold badges600 silver badges631 bronze badges

1 Comment

No Results Found Over a year ago

Thanks, I wrote this a while back and I guess never tested it. Not sure what I was thinking, I guess I assumed it would go 0=firstvalue&1=secondvalue etc.

Collectives™ on Stack Overflow

jQuery UI sortable not serializing with custom attributes

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related