Comment puis-je enregistrer les modifications triables de jQuery UI dans une base de données ?

Enregistrement des modifications de l'ordre triable dans jQuery UI dans une base de données

L'intégration de la fonctionnalité Sortable de jQuery UI permet aux utilisateurs de réorganiser les éléments. Pour enregistrer ces modifications dans une base de données, procédez comme suit :

1. Implémentez Sortable :

   • Incluez le script Sortable sur votre page Web.

2. Capturer la commande Modifications :

   • Utilisez l'événement de mise à jour pour capturer les modifications dans l'ordre des éléments.

3. Sérialiser les données :

   • Utilisez la méthode Serialize pour obtenir un tableau contenant l'ordre actuel des éléments.

4. Requête AJAX :

   • Envoyer une requête AJAX à un script côté serveur en utilisant les données sérialisées comme un paramètre.

5. Base de données Mise à jour :

   • Côté serveur, analysez les données soumises et mettez à jour la base de données en conséquence. Par exemple, vous pouvez mettre à jour la colonne de position en fonction de l'ordre du tableau.

Exemple de code :

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

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

Détails d'implémentation :

• Lorsqu'un élément change de position, l'événement de mise à jour est déclenché, capturant la nouvelle commande sous forme de tableau.
• La méthode Serialize convertit la commande en paramètre de chaîne de requête, ce qui facilite sa transmission au script côté serveur via une requête AJAX.
• Le serveur -un script côté (par exemple PHP) peut ensuite traiter de manière itérative les éléments du tableau et mettre à jour la base de données avec le nouveau positions.

Exemple de script côté serveur (PHP) :

$i = 0;

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

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!