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: /

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

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/ogzw5pL2/

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

• javascript
• jquery
• jquery-ui

Share Follow asked Aug 5, 2015 at 17:37 No Results FoundNo Results Found 103k3838 gold badges198198 silver badges231231 bronze badges 2

• 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 Commented Nov 13, 2017 at 16:52
• @stormdrain its is passing nmp and bowser test currantly but i try to pile 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 Commented Nov 13, 2017 at 17:05

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 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/c2o3txry/

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.