5

Próbuję zaimplementować jQuery Draggable | Droppable | Sortable pomiędzy ramką nadrzędną i podrzędną. Mam ten prototyp, ale istnieją pewne dziwne zachowanie dziejeJquery do sortowania i przeciągania między ramką nadrzędną i podrzędną

win = document.getElementById('frame').contentWindow; 

element = win.document.getElementById('sortable'); 
$(element).sortable(); 
console.log(element); 
$("#draggable").draggable({ 
     connectToSortable: $(element), 
    iframefix: true, 
    helper: function() {return $("<div/>").css('background-color','red');} 
}); 

Strona iframe zawiera również

$("#sortable").sortable(); 

Oto jsfiddle http://jsfiddle.net/vxAzs/5/

To działa dobrze, gdy próbuję upuść element na elemencie iframe, ale gdy próbuję posortować elementy w elemencie iframe, element ten przykleja się do zdarzenia kliknięcia na obu stronach (więc nie zostanie odrzucony, dopóki nie kliknę elementu nadrzędnego i ramek iframe). Myślę, że ma to coś wspólnego z wywołaniem .sortable() zarówno w elemencie nadrzędnym, jak i iframe, ale jeśli usunę, że droppable przestanie działać.

Odpowiedz

3

ok, oto jak to robię .. Aby utworzyć przeciągnięcie na elemencie z ramki nadrzędnej i upuścić go na sortowalną listę w elemencie iframe, Utworzono przeciągnięcie elementu elementu nadrzędnego z wewnątrz ramki iframe

win = document.getElementById('<identifier for Iframe>').contentWindow; 
win.jQuery(dragelement,parent.document).draggable({ 
connectToSortable : $("#sortable") 
)} 

Działa jak urok!

+0

daje mi ten błąd .. Uncaught TypeError: Object [obiekt globalny] nie ma metody "jQuery". Proszę mi pomóc, jak to rozwiązałeś. – vaibought

+0

należy włączyć jQuery na obu ramkach nadrzędnych i podrzędnych ... –

+0

jquery jest dodawany po obu stronach. Używam jquery 1.8. – vaibought

0

komentarz ten wiersz w kodzie,

//$(element).sortable({iframefix:true}); 

oto skrzypce: link

+1

jeśli to zrobię, to element nie zostanie połączony z listą sortowalną –

0

iframeFix jest wielkość liter: Zmień

iframefix: true, 

do

iframeFix: true, 
Powiązane problemy