順序を維持するために jQuery UI Sortable をデータベースと統合するにはどうすればよいでしょうか?

jQuery UI Sortable とデータベースの統合

jQuery UI Sortable を使用すると、ユーザーが要素を再配置し、特定の順序を維持できるようになります。この機能をデータベースと統合するには、AJAX またはフォーム送信と組み合わせてシリアル化メソッドを利用できます。

<code class="javascript">$('#sortable').sortable({
    axis: 'y',
    update: function (event, ui) {
        var data = $(this).sortable('serialize');

        $.ajax({
            data: data,
            type: 'POST',
            url: '/your/url/here'
        });
    }
});</code>

次のような HTML 構造を利用することで、

<code class="html"><ul id="sortable">
   <li id="item-1"></li>
   <li id="item-2"></li>
   ...
</ul></code>

シリアル化このメソッドは、item[]=1&item[]=2 のようなクエリ文字列を生成します。各値は再配置された要素の ID を表します。

データベース ID が要素 ID と一致すると仮定すると、次のクエリ文字列をループできます。データを POST し、対応するデータベース レコードを新しい位置で更新します。

<code class="php">$i = 0;

foreach ($_POST['item'] as $value) {
    $query = "UPDATE [Table] SET [Position] = $i WHERE [EntityId] = $value";
    // Execute the query
    $i++;
}</code>

jQuery UI Sortable をデータベースと統合すると、オブジェクトの順序を動的に維持でき、順序付けと永続化のための使いやすいインターフェイスが提供されます。

以上が順序を維持するために jQuery UI Sortable をデータベースと統合するにはどうすればよいでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。