Question

您好我正在尝试使用jquery sortable和laravel来命令我的数据库中的某些任务，但是当我尝试序列化数据时，它似乎丢失了，因为当我控制日志变量时，我将它分配给它是空白的。

e.g。

var data = $(this).sortable('serialize');
console.log(data);

我也尝试了以下内容，它在控制台中未定义

var id = $(this).attr("data-task-id");
console.log(id);

我的完整jQuery如下：

$('.sortable').sortable({
        cursor: 'move',
        axis: 'y',
        update: function (event, ui) {
            var id = $(this).attr("data-task-id");
            console.log(id);
            var data = $(this).sortable('serialize');
            console.log(data);
            // POST to server using $.post or $.ajax
            $.ajax({
                data: data,
                type: 'POST',
                url: '/backlog/sort/update'
            })
        }
});

我的控制器如下：

public function updateBacklogOrder() {
    $updateRecordsArray = Input::all();

    $i = 1;

    // Loop though the <li>
    foreach ($updateRecordsArray as $recordID) {

        BacklogTask::where('id', $id)->update(array('order' => Input::get('order')));
        $i++;
    }

    return Response::json('ok');  
}

我的刀片文件如下：

@foreach（$ tasks为$ task） ID}}＆＃34;＆GT; {{$任务 - ＆GT;名称}} @endforeach

这将呈现以下内容：

任务一任务二任务三任务四

奇怪的是数据没有使用可排序方法进行序列化，如果我把它移到外面就会抱怨我已经在可排序方法之外加载了这个。我有什么想法吗？

Answer 1

您需要id个属性才能使用serialize。如果您只有data个属性，那么它将无法正常工作。结构应该是这样的：

<li id="key_value"></li>

＆＃39>输出如下字符串：

key[]=value&key[]=value// etc.

您可以通过设置所需的密钥来自定义更多内容，如下所示：

$(this).sortable('serialize', {key: "sort"})

这将输出：

sort=value&sort-value// etc.

但是您需要id属性，并且必须正确格式化（默认值是键和值之间的下划线，但您可以使用＆＃34; =＆＃34;和＆＃34; - ＆＃34在您的情况下，您可以在更新时动态添加ID，但直接在HTML中设置它们会更有效。但这应该给出一个输出：

$('.sortable').sortable({
        cursor: 'move',
        axis: 'y',
        update: function (event, ui) {
            var id = $(this).attr("data-task-id");
            $(this).find('[data-task-id]').each(function () {
                 $(this).attr('id', 'task-' + $(this).data('task-id'));
            });
            console.log(id);
            var data = $(this).sortable('serialize', {key:"task-id");
            console.log(data);
            // POST to server using $.post or $.ajax
            $.ajax({
                data: data,
                type: 'POST',
                url: '/backlog/sort/update'
            })
        }
});

编辑：

参数的顺序将按它们在可排序中的顺序排列。像这样：

task-id=value_of_first&task-id=value_of_second //etc.

第二次编辑：

事实证明，在序列化中使用其他属性是一种方法，但您需要设置不同的选项。这应该不分配id：

var data = $(this).sortable('serialize', {key:'task-id',attribute: 'data-task-id', expression: /(\w+)/});

为了进一步澄清，如果你同时使用这两个部分，你会发现你可以根据自己的需要得到post几乎所需的字符串。此时，根据我对您的控制器的理解，序列化并不一定是最好的方法，但由于您已经有了设置，因此您可以通过id=order形式发送参数：< / p>

    $(this).find('[data-task-id]').each(function (i) {
        $(this).attr('data-to-send', $(this).data('task-id')+'_'+i);
    });
    $(this).sortable('serialize',{attribute: 'data-to-send'}).replace(/\[\]/g, '');

Laravel jquery sortable不是序列化数据

1 个答案: