Jak przeciągnąć siatkę z jednego gridsteru na inny gridster?

Question

Jak przeciągnąć siatkę z jednego gridsteru na inny gridster?

$(function() { //DOM Ready 

    $(".gridster ul").gridster({ 
     widget_margins: [5, 5], 
     widget_base_dimensions: [160, 160] 
    }); 

    var gridster = $(".gridster ul").gridster().data('gridster'); 
    $(".draggable").draggable(); 
    $(".gridster ").droppable({ 
     drop: function(event, ui) { 
      $(".draggable").removeAttr("style"); 
      gridster.add_widget('<li class="new"></li>', 1, 1);     
     } 
    });       
}); 

Answer 1

Za pomocą funkcji remove_widget i add_widget w interfejsie gridster można dodawać i usuwać widżety.

Aby zobaczyć, czy widget jest przeciągany, można sprawdzić, czy pozycja początkowa myszy zmieniła się po naciśnięciu przycisku myszy na widżecie, z wydarzeniem onmousedown, do momentu zwolnienia kliknięcia, onmouseup wydarzenie. Porównaj pozycję początkową i końcową, aby zobaczyć, czy przeciągnęliśmy widżet, a następnie, jeśli to zrobiliśmy, sprawdź, czy przeciągnęliśmy widget na jeden z innych gridsterów, porównując pozycję upuszczenia z offsetem wszystkich obiektów gridster. Gdybyśmy upuścił go na innych gridsters, po prostu wywołać funkcję remove_widget z gridster element znajdował się i wywołać funkcję gridster add_widget należy umieścić w.

robiłem najwięcej udział w tym jsFiddle, daje pewne błędy, które prawdopodobnie wynikają z faktu, że gridster.js wciąż jest w wersji beta: http://jsfiddle.net/Ld2zc/11/