我正在使用一个名为nestedSortable
的插件来对列表的顺序进行排序,并将嵌套的(ul li
)排序到数据库mySQL。
但是,使用此插件更改时无法保存订单。我以前使用过sortable插件,它在更改时会将订单保存到数据库,但没有嵌套选项。
HTML code:
<div id="dnp">
<ul id="sort" class="list-group">
<?php
try
{
$conn = new PDO('mysql:dbname=uwv;host=localhost', 'root', '');
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sqlString = "SELECT * FROM uwv_test1 ORDER BY Question_Order;";
$stmt = $conn->query($sqlString);
$stmt->execute();
while($row = $stmt->fetch(PDO::FETCH_ASSOC))
{
echo "<li id='id_" . $row['QuestionID'] . "' class='list-group-item space'><i class='fa fa-bars fa-lg'></i> "
. "<a href='#'>" . $row['Question'] . "</a>/li>";
}
}
catch(PDOException $e)
{
echo $connection->errorCode();
echo $connection->errorInfo();
}
?>
</ul>
</div>
jQuery代码:
$(document).ready(function()
{
$('#sort').nestedSortable({
helper: fixHelper,
handle: '.fa',
containment: 'document',
tolerance: 'move',
cursor: 'move',
revert: 'true',
placeholder: 'placeholder',
connectWith: 'ul#sort, ul ul#sort, #sort',
update: function(){
var order = $('#sort').nestedSortable('serialize');
$.ajax({
type: "GET",
dataType: "JSON",
url: "process-sorting.php",
data: order
});
//$('#info').load("process-sorting.php?"+order);
}
}).disableSelection();
// Return a helper with preserved width of cells
var fixHelper = function(e, ui)
{
ui.children().each(function()
{
$(this).width($(this).width());
});
return ui;
};
});
PHP代码:
$ids = $_GET['id'];
$display_order = 1;
foreach($ids as $id)
{
$db = new PDO('mysql:dbname=uwv;host=localhost', 'root', '');
$stmt = $db->prepare("UPDATE uwv_test1 SET Question_Order = :display_order WHERE QuestionID = :id");
$stmt->bindParam(':id', $id);
$stmt->bindParam(':display_order', $display_order);
$stmt->execute();
$display_order++;
}
每当我使用插件jQuery sortable时,我都没有将更改后的订单保存到数据库的问题:
$('#sort').sortable({
helper: fixHelper,
handle: '.fa',
containment: 'document',
tolerance: 'move',
cursor: 'move',
revert: 'true',
placeholder: 'placeholder',
connectWith: 'ul#sort, ul ul#sort, #sort',
update: function(){
var order = $('#sort').sortable('serialize');
$.ajax({
type: "GET",
dataType: "JSON",
url: "process-sorting.php",
data: order
});
//$('#info').load("process-sorting.php?"+order);
}
}).disableSelection();
有人可以帮我吗?我不擅长解释事情,如果没有得到很好的解释,我很抱歉。