jQuery Glisser et déposer: Quelle est la meilleure façon de stocker plusieurs positions d'objets dans la base de données? Je

Question

quelque chose comme ceci:

<div class="wrapper"> 
    <div class="drag object1">Example1</div> 
    <div class="drag object1">Example1</div> 
    <div class="drag object1">Example1</div> 
    <div class="drag object1">Example1</div> 
    <img src="image.png"> 
</div> 

Fondamentalement, toutes les classes "drag" sont glissables et déposables. Je me demandais quelle est la meilleure façon de stocker tout dans la base de données. Est-ce une bonne idée de tout stocker en tant que blob JSON lorsque l'utilisateur fait une chute dans un wrapper et l'enregistre en tant que JSON dans une rangée dans mySQL? Ou devrais-je simplement enregistrer quel objet individuel a été déplacé dans une table séparée dans mySQL?

Si c'est du blob JSON, comment utiliser jQuery pour sérialiser les divs dans #wrapper en jSONS?

Merci!

Answer 1

Il peut être difficile d'enregistrer SEULEMENT des objets déplacés, et je ne pense pas que ce soit trop (en termes de trafic) pour enregistrer une liste de 100 éléments comme celle-ci.

Je pense un peu de balisage supplémentaire est nécessaire (et vous devriez en avoir besoin) afin d'aider sérialiser les choses:

<div class='drag object1' data-id='1234'>example1</div> 
<div class='drag object1' data-id='1452'>example1</div> 

que je suis en utilisant le préfixe de balisage HTML5 pour marquer votre clé d'entité. (Il joue bien dans les navigateurs non html5 ainsi)

Puis, JQ,

var listOfDrag = []; 
$(".wrapper .drag").each(function(){ 
    listOfDrag.push({id: $(this).attr("data-id")}); 
}); 

Puis juste après le tableau ci-dessus au serveur, en utilisant jquery.