我正在尝试制作一个可拖动的数据表,但是当我拖动该行时,它会跳回原来的位置。
我的代码如下所示:
的jQuery
var table = $('#'+table_id).DataTable(
{
"ordering": false,
"sScrollY": ($(window).height() - 600),
"scrollX": false,
"bPaginate": false,
"sClass":"table_no_whitespace",
"columnDefs": [
{ className: 'reorder', targets: 1 },
],
"rowReorder": {
selector: 'td.reorder'
}
});
HTML
<table id="exam_exercises" class="table display table-striped table-bordered mb-none no-footer">
<thead>
<tr>
<th style="text-align: center; padding: 8px!important">
<img class="toggle_select_all" which_box="infobox" src="<?= base_url(); ?>img/tickbox/unchecked.png">
</th>
<td></td>
<th>Exercise</th>
</tr>
</thead>
<tbody>
<?php if (count($exercises) > 0) : ?>
<?php foreach ($exercises as $exercise) : ?>
<tr class="itemrow" id="exercise_<?= $exercise['id']; ?>" myid="<?= $exercise['id']; ?>" id="e_<?= $exercise['id']; ?>">
<td class="non-selectable tickcell" style="width: 1px; text-align: center">
<img class="individual_checkbox" which_box="infobox" id="check_<?= $exercise['id']; ?>" src="<?= base_url(); ?>img/tickbox/unchecked.png">
</td>
<td style="text-align: center;" class="reorder"><?= $exercise['sort']; ?></td>
<td><?= $exercise['exercise_name']; ?></td>
</tr>
<?php endforeach; ?>
<?php endif; ?>
</tbody>
</table>
目前我的桌子看起来像这样: 我使用第二列作为可拖动单元格,此列不用作默认排序列,因为我的数据是在数据库查询中排序的。
我相信我可能会遗漏一些小事,但我还没有找到解决办法。
提前完成