jQuery UI Sortable - 序列化多列

我有一个小脚本，它允许我使用jQuery在3列之间很好地对div标签进行排序。 jQuery的下面可以看到：jQuery UI Sortable - 序列化多列

$(".column").sortable(
{ connectWith: '.column' }, 
{ update: function(event, ui) { alert($(this).sortable('serialize')) } 
});

如果我从第1列项目移动到第2栏，它会显示2级的警报，显示了2组受影响的列序列化的数据。问题是，我也需要知道列ID，所以我最终可以将数据保存到数据库中。现在，如果可以在警报中显示列ID，但这足以让我继续。

来源

2010-06-10 oshirowanen

$(".column").sortable(
    { connectWith: '.column' }, { update: function(event, ui) { 
    alert($(this).sortable('serialize')); 
    alert($(this).parents('.column').attr(id)); 
    } 
});

我认为应该有效。找到您移动的div的父列，然后获取它的id属性。

来源

2010-06-10 15:51:07 Qwibble

'this.id'获得列ID，无需父母，attr等。 – 2010-12-08 19:16:32

得到它的工作使用 “最接近” 的方法：

{更新：（$（本）.closest（ “格”）ATTR（ “ID”））功能（事件，UI）{ 警报; alert（$（this）.sortable（'serialize'）） }

来源

2010-06-11 07:51:09 oshirowanen

刚刚解决了这个非常非常肮脏的把戏。喜欢与你分享，也许它有帮助。

<div class="column" > 
    <div class="portlet" id="portlet_1_name"> 
    <div class="portlet-header">Title1</div> 
    <div class="portlet-content">Text</div> 
    </div> 
    <div class="portlet" id="portlet_2_name"> 
    <div class="portlet-header">Title2</div> 
    <div class="portlet-content">Text</div> 
    </div> 
</div> 
<!-- for debug --> 
<div id="serial"></div>

等等

var out = ""; 

$('.portlet').each(function(index) { 
    out += $(this).attr('id') + ','; 
}); 

$("#serial").html(out); 
// or alert(out) if you like

来源

2010-07-28 20:45:23 Soliman

我一直在寻找一个好的答案，这个，没有对这里的人的真的是正是我想要的，所以我将分享我做的方式它：

$('ul.playerList').each(function() { 
    var id = $(this).attr('id'); // get element id 
    window[id] = $(this).sortable("serialize",{key:id}); // make global var w/ data 
}); 

// you could make this more dynamic if you have a lot of lists 
var data = ul_id_1 + "&" + ul_id_2 + "&" + ul_id_3 + "&action=other_vars"; 

$.post(url,data,function(resp) { 
    $("#test").html(resp); 
});

来源

2011-06-21 13:46:34

jQuery UI Sortable - 序列化多列

回答

相关问题