jQuery nestedSortable,将命令保存到数据库

时间:2015-03-12 13:53:39

标签: php jquery mysql jquery-ui-sortable nested-sortable

我正在使用一个名为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>&nbsp;"
                            . "<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();

有人可以帮我吗?我不擅长解释事情,如果没有得到很好的解释,我很抱歉。

0 个答案:

没有答案