JQuery可排序序列化

JQuery Sortable Serialized

本文关键字:序列化 排序 JQuery      更新时间:2023-09-26

我使用http://johnny.github.io/jquery-sortable/排序表,我有JQuery工作没有问题,但我不能得到序列化正确工作。我想知道是否有人可以帮助和解释我需要做什么?

所以我的html是。

<table class="table table-striped table-bordered sorted_table" id="positionstable">
    <tbody>
        <tr>
            <th class="sectionname" colspan="1">Position</th>
        </tr>
        <tr data-id="2">
            <td class=" ">Item 2</td>
        </tr>
        <tr data-id="1">
            <td class=" ">Item 1</td>
        </tr>
        <tr data-id="3">
            <td class=" ">Item 3</td>
        </tr>
        <tr data-id="4">
            <td class=" ">Item 4</td>
        </tr>
    </tbody>
</table>

我的JQuery是:

$('.sorted_table').sortable({
  containerSelector: 'table',
  itemPath: '> tbody',
  itemSelector: 'tr',
  placeholder: '<tr class="placeholder"/>',
  onDrop: function (item, container, _super) {
            var dataToSend = $('.sorted_table').sortable("serialize").get();
            console.log(dataToSend)
            $.ajax({
                url: "ajax_action.php",
                type: "post",
                data: dataToSend,
                cache: false,
                dataType: "json",
                success: function () {}
            });
            //_super(item, container);
        }
})

您也可以在http://jsfiddle.net/WJProctor/7GqQu/

找到代码。

我想ID的数组被发送到我的ajax脚本。

我期待你的任何帮助和建议。

亲切的问候詹姆斯

通常序列化在表单元素上工作并生成JSON对象,使用每个字段的名称作为键,并使用元素的值作为值。

可以很容易地生成一个序列化的对象,就像循环遍历表行一样

$('.sorted_table').sortable({
  containerSelector: 'table',
  itemPath: '> tbody',
  itemSelector: 'tr',
  placeholder: '<tr class="placeholder"/>',
  onDrop: function (item, container, _super) {
            var obj = jQuery('.sorted_table tr').map(function(){
                return 'trvalue[]=' + jQuery (this).attr("data-id");
            }).get();
          console.log(obj)
          //do the ajax call
        }
})
http://jsfiddle.net/7GqQu/1/