Comment enregistrer l'ordre des éléments triables de jQuery UI dans une base de données ?

Stockage de l'ordre des éléments triables de jQuery UI dans une base de données

En utilisant la fonction triable de jQuery UI, nous pouvons réorganiser les éléments et enregistrer le nouvel ordre à une base de données. Voici un exemple complet :

La fonction sortable inclut une méthode « sérialiser » qui crée un tableau d'éléments avec leurs identifiants. En utilisant ce tableau, nous pouvons générer une chaîne de requête qui envoie ces informations à une URL spécifiée lorsque la position d'un élément change.

$('#element').sortable({
    axis: 'y',
    update: function (event, ui) {
        var data = $(this).sortable('serialize');

        // Send data to server using Ajax
        $.ajax({
            data: data,
            type: 'POST',
            url: '/your/url/here'
        });
    }
});

Dans le script côté serveur (par exemple, PHP), nous pouvons parcourir le tableau reçu et mettre à jour les enregistrements de la base de données en conséquence :

$i = 0;

foreach ($_POST['item'] as $value) {
    // Execute statement:
    // UPDATE [Table] SET [Position] = $i WHERE [EntityId] = $value
    $i++;
}

Cela nous permet de mettre à jour dynamiquement l'ordre des éléments à la fois côté client et dans la base de données, garantissant que les modifications apportées par les utilisateurs sont conservées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!