javascript - jQuery UI 可排序不使用自定义属性序列化

Question

我正在使用可通过 data-id 属性排序的 jQuery UI。我知道您可以将 sortable('serialize') 与 id="row_4" 之类的东西一起使用，这对我有用，但我需要这样做。

• sortable('serialize', {attribute: 'data-id'}) 给出一个空字符串
• sortable('toArray'), {attribute: 'data-id'}) 给出预期的输出

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

这是怎么回事？我 98% 确定这以前有效。

Answer 1

serialize 需要key 和value，但您可以使用参数来覆盖默认行为并获得想要的结果。

在你的情况下，你可以设置你想要的attribute、key 和expression，以便它采用data-id 并使用定义的 key 和适当的值构建字符串。像这样:

           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/