イムを得る:https://github.com/isocra/TableDnD/blob/master/index.html表の行の低下は、このプラグインを使用してIDとシーケンス
iは&が行をドラッグ&ドロップした場合、私は警告でドロップされた行のIDを取得し、それが動作します。
行の順序はどのように取得できますか?私はajaxで画像シーケンスを更新するためにこれを使用したいと思います。
$("#table-2").tableDnD({
onDrop: function(table, row) {
var rows = table.tBodies[0].rows;
var debugStr = "Row dropped was ID: "+row.id+"";
alert(debugStr);
}
});
テーブルソースコードを自分のサイトのソースコードからコピーします。テーブルはphpによって生成されます。
<table class="table table-hover table-bordered list" id="table-2">
<thead>
<tr>
<td style="width: 1px; text-align: center;"><input class="checkAllCheckboxes" type="checkbox"></td>
<td style="text-align: center;">ID</td>
<td class="left">Kép</td>
<td class="left">Megnevezés</td>
<td style="text-align: center;">Sorrend</td>
<td style="text-align: center;">Státusz</td>
<td class="right">Műveletek</td>
</tr>
</thead>
<tbody>
<tr id="sor32">
<td class="left"><input class="table_row_checkbox" name="selectedRows[]" type="checkbox" value="32"></td>
<td style="text-align: center;">32</td>
<td class="left"><img class="img-responsive" src="images/homepage_slideshow/492-PS-VR_.jpg" width="200"></td>
<td class="left"></td>
<td style="text-align: center;">1</td>
<td style="text-align: center;">Aktív</td>
<td class="right">
<a href="slideshow-szerkesztes.php?id=32"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> <a class="deleteLink" href="#" id="32"><span class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span></span></a>
</td>
</tr>
<tr id="sor31">
<td class="left"><input class="table_row_checkbox" name="selectedRows[]" type="checkbox" value="31"></td>
<td style="text-align: center;">31</td>
<td class="left"><img class="img-responsive" src="images/homepage_slideshow/503-WatchDogs2_FarCrayPrimal_1_.jpg" width="200"></td>
<td class="left"></td>
<td style="text-align: center;">3</td>
<td style="text-align: center;">Aktív</td>
<td class="right">
<a href="slideshow-szerkesztes.php?id=31"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> <a class="deleteLink" href="#" id="31"><span class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span></span></a>
</td>
</tr>
<tr id="sor30">
<td class="left"><input class="table_row_checkbox" name="selectedRows[]" type="checkbox" value="30"></td>
<td style="text-align: center;">30</td>
<td class="left"><img class="img-responsive" src="images/homepage_slideshow/324-DeadRising4_megjelent.jpg" width="200"></td>
<td class="left"></td>
<td style="text-align: center;">2</td>
<td style="text-align: center;">Aktív</td>
<td class="right">
<a href="slideshow-szerkesztes.php?id=30"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> <a class="deleteLink" href="#" id="30"><span class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span></span></a>
</td>
</tr>
<tr id="sor24">
<td class="left"><input class="table_row_checkbox" name="selectedRows[]" type="checkbox" value="24"></td>
<td style="text-align: center;">24</td>
<td class="left"><img class="img-responsive" src="images/homepage_slideshow/89-FIFA_17_B4jlEln.jpg" width="200"></td>
<td class="left"></td>
<td style="text-align: center;">4</td>
<td style="text-align: center;">Intaktív</td>
<td class="right">
<a href="slideshow-szerkesztes.php?id=24"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> <a class="deleteLink" href="#" id="24"><span class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span></span></a>
</td>
</tr>
<tr id="sor23">
<td class="left"><input class="table_row_checkbox" name="selectedRows[]" type="checkbox" value="23"></td>
<td style="text-align: center;">23</td>
<td class="left"><img class="img-responsive" src="images/homepage_slideshow/90-konzolkiraly_sl_1467362325.jpg" width="200"></td>
<td class="left"></td>
<td style="text-align: center;">3</td>
<td style="text-align: center;">Intaktív</td>
<td class="right">
<a href="slideshow-szerkesztes.php?id=23"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> <a class="deleteLink" href="#" id="23"><span class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span></span></a>
</td>
</tr>
</tbody>
</table>
更新:
iは最初のドロップのID 24行を削除した場合、それは更新され、OKのthats。しかし、ID 30の行は実際の位置(シーケンス1)にとどまっています。
これで何ができますか?
$("#table-2").tableDnD(
{
onDrop: function(table, row)
{
var rows = table.tBodies[0].rows;
var RowID = row.id.substr(3);
var RowIndex = $(row).index() + 1;
$.ajax({
data: { RowID:RowID, RowIndex:RowIndex },
type: 'POST',
url: 'files/update_slide_index.php',
success: function(data)
{
var result = $.trim(data);
$('#newsletterResult').html(result);
$('#newsletterModal').modal('show');
},
complete: function()
{
setTimeout(function()
{
location.reload();
}, 3000);
}
});
}
});
<?php
include_once("../../files/connect.php");
if(isset($_POST['RowID']))
{
$RowID = intval($_POST['RowID']);
$RowIndex = intval($_POST['RowIndex']);
$sql = "UPDATE slideshow SET slide_sorrend = '$RowIndex' WHERE slide_id = '$RowID'";
mysqli_query($kapcs, $sql) or die(mysqli_error($kapcs));
echo 'A kép sorrendje sikeresen megváltozott.';
}
else
{
echo 'Nincs ID';
}
?>
アップデート2:たぶん
この?
mysqli_query($kapcs, "UPDATE slideshow SET slide_sorrend = slide_sorrend + 1 WHERE slide_id != '$RowID'") or die(mysqli_error($kapcs));
を試してみてください。私はあなたが何をしたいのか分かりません –
私は行を落としたいと思っています。例:aftrドロップ、行が最初の行、またはその2番目... –