我正在使用一个名为jQuery Sortable(http://johnny.github.io/jquery-sortable/)的jQuery插件。我正在使用页面上的最后一个示例,即"排序表"。我做了一张桌子,可以分类。文档并不详尽,我对jQuery的了解有限。
到目前为止,我已经设法对表拖放样式进行排序。我需要做的是以新的顺序从每个tr中检索id,将其存储在一个数组中并将其发布到服务器端脚本。
<table class="table table-hover sorted_table">
<tbody>
<tr id="1">
<td>Something</td>
<td>Information</td>
<td>Column</td>
</tr>
<tr id="2">
<td>Something</td>
<td>Information</td>
<td>Column</td>
</tr>
<tr id="3">
<td>Something</td>
<td>Information</td>
<td>Column</td>
</tr>
</tbody>
</table>
<script>
// Sortable rows
$('.sorted_table').sortable({
containerSelector: 'table',
itemPath: '> tbody',
itemSelector: 'tr',
placeholder: '<tr class="placeholder"/>'
})
</script>
答案 0 :(得分:1)
var table = $('.sorted_table').sortable({
containerSelector: 'table',
itemPath: '> tbody',
itemSelector: 'tr',
placeholder: '<tr class="placeholder"/>',
onDrop: function (item, container, _super) {
var ids = table.find('tr').map(function() {
return this.id;
}).get();
console.log(ids);
_super(item, container);
}
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://johnny.github.io/jquery-sortable/js/jquery-sortable.js"></script>
<table class="table table-hover sorted_table">
<tbody>
<tr id="1">
<td>Something1</td>
<td>Information</td>
<td>Column</td>
</tr>
<tr id="2">
<td>Something2</td>
<td>Information</td>
<td>Column</td>
</tr>
<tr id="3">
<td>Something3</td>
<td>Information</td>
<td>Column</td>
</tr>
</tbody>
</table>
&#13;