2009-12-19 3 views
1

Je fais beaucoup d'efforts pour que cela fonctionne! J'ai une liste d'images dans un div que je fais glisser. J'ai aussi une boîte de dialogue qui est déclenchée (ouverte) quand le glissement commence. Pour une raison quelconque, je ne peux pas tomber dans cette boîte de dialogue. Je peux laisser tomber partout ailleurs sur la page sauf dans un dialogue. voici mon code:faites glisser et déposez dans un dialogue

$(document).ready(function(){ 
    // Executed once all the page elements are loaded 
    //setup new person dialog 
    // Change overlay color and opacity 
    $('#sample').dialog({ 
     //dialog options 
     autoOpen: false, 
       draggable: false, 
       modal: false, 
       show: 'explode', 
       closeOnEscape: true, 
       position: 'top', 
       minHeight: '400', 
       minWidth: '600', 
       width: 750, 
       title: "Some title", 
       open: function(type, data) { 
        $(this).parent().appendTo("form"); 
       } 
     }); 
$(".random-img").draggable(
     { 
      cursor: "move", 
      helper: "clone", 
      opacity: "0.5", 
      zIndex: "2700", 
      containment: "document", 
      handle: ".random-img", // makes toolbar the dragable part 
      drag: function(ev, ui) { 
       $('#sample').dialog("open"); 
      } 
     } 
    ); 
    $("#sample").droppable(
    { 
     accept: ".random-img", 
     tolerance: "touch", 
     drop: function(ev, ui) 
     {     
      var droppedItem = ui.draggable.clone().addClass('sclass');     
       $(this).append(droppedItem);        
     }  
    } 
    ); 
    }); 

</script> 
<html> 
<head> Page test </head> 
    <body> 
      <div class="random-img"> 
       <img src="images/someimage.jpg" />    
      </div> 
       <div id='sample'> 
       </div> 
    </body> 
</html> 

Toute aide ou aperçu sera grandement appréciée.

Merci

+0

son '$ (ui.draggable) .clone(). AddClass ('sclass')' – czarchaic

+0

merci czarchaic, j'ai ajouté ce que vous avez mentionné, il ne fonctionne toujours pas. Une chose que j'ai vu quand je jouais avec les options de la boîte de dialogue est que lorsque je définis autoOpen: true, cela fonctionne parfaitement! Je ne veux pas qu'il s'ouvre quand la page est chargée cependant. – paravamu

Répondre

1

J'ai enfin compris! Après des heures et des heures d'essai, cela fonctionne. J'ai déplacé la méthode d'ouverture de dialogue de draggable: faites glisser à draggable: commencez. Ensuite, je commence à obtenir des erreurs en disant this.helper sur la méthode draggable est nul ou pas un objet sur firefox tools-> console d'erreur.

J'ai éteint le firebug et maintenant ça marche parfaitement!

Merci pour votre aide! Praveen