jQueryUI.Sortable обновление без использования Ajax как обычная форма отправки в PHP

Question

jQueryUI.Sortable обновление без использования Ajax как обычная форма отправки в PHP

0

Я хотел бы отсортировать таблицу с строкой данных из MySQL, затем изменить порядок и отправить его.
Я использовал jQueryUI.sortable, чтобы перетащить те трёх теги (строки).
Но когда я отправляю форму, некоторые из них не изменили порядок.

Зачем? Я попытался понять это, я var_dump данные, которые я отправил, и я нашел проблему: трёх тег (строка), который я переместил из исходного порядка, не перейдет на PHP, поэтому var_dump не покажет идентификатор строки.

Чтобы было легче понять, я размещаю свой код здесь:

Код HTML

<table>
    <thead>
        <tr>
            <th>Subject</th>
            <th>Content</th>
        </tr>
    </thead>
    <tbody id="sortable">
        <tr>
            <td>
                Hello World
                <input name="displayorder[]" type="hidden" value="1" />
            </td>
            <td>I come from Mars!</td>
        </tr>
        <tr>
            <td>
                Hello Mars
                <input name="displayorder[]" type="hidden" value="2" />
            </td>
            <td>I come from Jupiter!</td>
        </tr>
        <tr>
            <td>
                Hello StackOverflow
                <input name="displayorder[]" type="hidden" value="3" />
            </td>
            <td>I come from North Korea ...</td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td colspan="2"><input type="submit" value="Submit!" />
        </tr>
    </tbody>
</table>

Я пропустил содержание формы, потому что это не важно

JavaScript (загружается загружаемая загружаемая библиотека)

$(document).ready(function() {
    $('#sortable').sortable({
        helper: fixHelper,
        axis: 'y',
        opacity: 0.6,
    }).disableSelection();
});

var fixHelper = function(e, ui) {
    ui.children().each(function() {
        $(this).width($(this).width());
    });
    return ui;
};

PHP

$displayorder = $_POST["displayorder"];
if($displayorder != "") {
    $order = 1;
    foreach($displayorder as $value) {
        mysql_query("UPDATE message SET displayorder=$order WHERE announcementid=$value");
        $order++;
    }
}

Я предпочту не использовать Ajax для этого, потому что у меня есть десятки похожих страниц для выполнения одной и той же задачи.
Заранее спасибо.

AkiEru 20 нояб. 2014, в 09:42

Источник

Теги:

php

jquery-ui

jquery-ui-sortable

1 ответ

Ещё вопросы

AkiEru · Accepted Answer · 2014-11-20T08-04-00.000Z

Ну, я решил записать его на каждую страницу.
Код сейчас:

JavaScript

$(document).ready(function() {
    $('#sortable').sortable({
        helper: fixHelper,
        axis: 'y',
        opacity: 0.4,
        update: function(event, ui){
            var data = $(this).sortable('serialize');

            $.ajax({
                data: data,
                type: 'POST',
                url:  '/update.php?action=displayorder'
            });         
        },
    }).disableSelection();
});

var fixHelper = function(e, ui) {
    ui.children().each(function() {
        $(this).width($(this).width());
    });
    return ui;
};

PHP

foreach($_POST["displayorder"] as $i => $value) {
    mysql_query("UPDATE message SET displayorder=$i WHERE announcementid=$value");
    $i++;
}