Sauvegarde de la position d'un div draggable dans les rails

Question

Après avoir fait un div draggable, je voudrais, lorsque le div est abandonné, transmettre au contrôleur la position div pour qu'il puisse être sauvegardé dans la base de données.

Ma première idée serait d'avoir une forme cachée dans le div, avec 2 champs de texte (un pour X et un pour Y) qui est maintenu à jour via javascript et soumis sur drop. Cependant, cela ressemble à un peu un hack et n'est pas une solution élégante. Est-ce que quelqu'un a déjà rencontré ça?

Merci.

Answer 1

J'allais aussi dire stocker les positions dans les champs de texte est une mauvaise idée. jQuery UI fournit draggable et est facilement utilisé. L'exemple ci-dessous envoie une requête ajax à chaque fois que l'élément est supprimé.

$('#draggable_element').draggable({ 
    stop: function(event, ui) { 
     $.post("http://example.com/some_action", 
      { top: ui.position["top"], left: ui.position["left"] }, 
      function() { 
       // callback stuff 
      } 
     ); 
    } 
}); 

Answer 2

Vous pouvez simplement utiliser une requête AJAX qui afficherait les valeurs X et Y dans votre application Rails en arrière-plan. Pas besoin de stocker les positions dans votre HTML.

Si vous utilisez jQuery, vous pouvez utiliser quelque chose comme ceci:

// Include this in an onDrop event handler: 
element = ... // dropped div 
url = "http://example.com/.../save_div_position/"; 
data = $(element).position(); 
success_callback = function(data, textStatus) { 
    // alert that new position is saved 
}; 
$.post(url, data, success_callback, "json");