4

嘿，我对 jquery 和 ajax 非常陌生，我正在寻找一些关于如何正确执行此操作的建议。

我有一个可以排序的 div，所以我可以根据需要安排事情。它看起来像：

$('#resource-detail-content).sortable({

然后在我的 ajax 数据中，我有类似的东西：

data: $('#resource-detail-content').sortable('serialize'),

效果很好，但是分解数据是有意义的，我将 div 分成两个单独的 div，并使用 connectWith 允许在两者之间拖动内容：

$('#resource-detail-content,#resource-detail-content2').sortable({
  connectWith: '#resource-detail-content,#resource-detail-content2',

我现在想弄清楚的是如何在我的 ajax put 中发送两个 div 的数据。我尝试了明显的：

data: $('#resource-detail-content, #resource-detail-content2').sortable('serialize'),

但没有运气。我绝对会感谢任何帮助。

干杯，肖恩

4

2 回答 2

6

首先你应该使用类而不是 ID，它会更灵活。

而且我认为问题在于您有 2 个对象，每次调用后数据内容都会被覆盖。

您应该使用一个函数，如下所示：

    data : getContent(),

    function getContent() {
        var data = "";

        $(".resource-detail-content").each(function(){
        if (data == "")    
           data += $(this).serialize();
        else 
           data += "&" + $(this).serialize();

        });
       return data;
    }
于 2012-06-22T15:35:04.510 回答
0

有一种更简单的方法可以做到这一点。我使用了 jQuery UI 示例中的 portlet，但我只有一列而不是三列：http: //jqueryui.com/sortable/#portlets

我想序列化所有的 portlet。所以这是我的代码：

update: function (event, ui) {
    var data = $(this).sortable('serialize', {
        "attribute": "data-sort"
    });
}

第二个参数中的attribute键更改了搜索特殊data-sort属性的行为，该属性的格式应如下所示：

<div class="portlet" data-sort="id=<?php echo $faq['Faq']['id']; ?>">
    <div class="portlet-header"><?php echo h($faq['Faq']['title']); ?></div>
    <div class="portlet-content"><?php echo h($faq['Faq']['body']); ?></div>
</div>

在 HTML 中，我的行如下所示：

<div class="column ui-sortable">
    <div class="portlet" data-sort="id=1">
        <div class="portlet-header">Question 1</div>
        <div class="portlet-content">Answer 1</div>
    </div>
    <div class="portlet" data-sort="id=2">
        <div class="portlet-header">Question 2</div>
        <div class="portlet-content">Answer 2</div>
    </div>
    <div class="portlet" data-sort="id=3">
        <div class="portlet-header">Question 3</div>
        <div class="portlet-content">Answer 3</div>
    </div>
</div>

在我交换前两个元素后得到这样的数据：

"id[]=2&id[]=1&id[]=3"
于 2014-09-19T13:09:54.730 回答