[Dojo-interest] Struggling with Drag and drop (Using Tree Widget)

Laurent Hasson ldh at laurent-hasson.com
Thu Nov 9 20:17:17 MST 2006


You say "You can do it now, quite easily...". I understand there may 
be issues but i have a very simple use-case, literally like what i 
showed below. I don't need to actually move DOM elements, i don't 
care about Ctrl behavior or other fancy things... I just would like 
to have a gesture for people to classify things that are listed in an 
HTML table, other categories that are listed in a Tree. It's like a 
FileExplorer, but with a very simple use-case.

Where can i find information on how to make my sample below work?

Many thanks,
LDH


At 08:28 PM 11/9/2006, Ilia Kantor wrote:

> > Is this for plain Tree, or TreeV3? Are we deprecating the plain Tree?
>We can't deprecate it.. TreeV3 has more D'n'D problems than Tree has..
>
>TreeV3 is fine mostly everywhere, excepts DnD.
>
> > So i have to wait until Dojo 0.5 to be able to drag an arbitrary
> > things onto a tree node then?
>You can do it now, quite easily... That's the part that works.
>But common Tree DnD status will remain 'experimental' for long... I don't
>recommend it, because there are known pending problems.
>
> >
> > Thanks for the info.
> > LDH
> >
> > At 04:56 PM 11/9/2006, Ilia Kantor wrote:
> > > > This seems to involve Tree DnD in Dojo 0.3.1. Perhaps Ilia would have
> > > > an idea.
> > >
> > >I dropped support for drag'n'drop in Tree until it dojo dnd core is
> > > rewritten (planned in 0.5).
> > >
> > > > James
> > > >
> > > > On 11/8/06, Laurent Hasson <ldh at laurent-hasson.com> wrote:
> > > > > Hello,
> > > > >
> > > > > I am trying to build a simple FileExplorer like UI with a folder tree
> > > > > on the left, and a table of files on the right. I want to be able to
> > > > > DnD file links from the table onto the tree but i have spent the past
> > > > > few days trying to make it happen without success. Here are parts of
> > > > > my code:
> > > > >
> > > > > <SCRIPT>
> > > > >      dojo.require("dojo.lang.*");
> > > > >      dojo.require("dojo.event.*");
> > > > >      dojo.require("dojo.widget.*");
> > > > >      dojo.require("dojo.dnd.HtmlDragMove");
> > > > >      dojo.require("dojo.widget.Tree");
> > > > >      dojo.require("dojo.widget.TreeNode");
> > > > >      dojo.addOnLoad(init);
> > > > > function init(e)
> > > > >   {
> > > > >     var controllerWidget =
> > > > > dojo.widget.createWidget("TreeBasicController"); var tree =
> > > > > dojo.widget.createWidget("Tree", { id:"tree1",
> > > > > listeners : [controllerWidget.widgetId],
> > > > >                                                   DndAcceptTypes :
> > > > > "filehandle", DndMode : "ONTO"
> > > > >                                                 }
> > > > >                                               , dojo.byId("tree")
> > > > >                                        );
> > > > >     var root = dojo.widget.createWidget("TreeNode", {title: "Root"});
> > > > >     tree.addChild(root); root.isFolder = true; root.expand();
> > > > >     var node = dojo.widget.createWidget("TreeNode", {title:
> > > > > "Administrative Stuff"});
> > > > >     root.addChild(node);
> > > > >     node = dojo.widget.createWidget("TreeNode", {title: "Fun
> > > > > Stuff"}); root.addChild(node);
> > > > >   }
> > > > > function DropOnTree(message)
> > > > >   {
> > > > >     var rep = "";
> > > > >     for(i in message.dragSource) rep+= i+": "+message[i]+"\n";
> > > > >     alert(rep);
> > > > >     rep = "";
> > > > >     for(i in message) rep+= i+": "+message[i]+"\n";
> > > > >     alert(rep);
> > > > >   }
> > > > > </script>
> > > > >
> > > > > <TABLE BORDER=0 CELLSPACING=0 CELLPADDING=5 WIDTH=100%>
> > > > >    <TR VALIGN=top>
> > > > >      <TD><DIV id="tree"></DIV></TD>
> > > > >      <TD><TABLE BORDER=1 CELLSPACING=0>
> > > > >             <TR><TD id="TD1">File 1</TD></TR>
> > > > >             <TR><TD id="TD2">File 2</TD></TR>
> > > > >          </TABLE>
> > > > >      </TD>
> > > > >    </TR>
> > > > > </TABLE>
> > > > >
> > > > > <SCRIPT>
> > > > >    function SetDnD()
> > > > >     {
> > > > >       dojo.event.connect(new
> > > > > dojo.dnd.HtmlDragSource(document.getElementById("TD1"), "filehandle")
> > > > >                          , "onDragEnd", DropOnTree);
> > > > >       dojo.event.connect(new
> > > > > dojo.dnd.HtmlDragSource(document.getElementById("TD2"), "filehandle")
> > > > >                          , "onDragEnd", DropOnTree);
> > > > >     }
> > > > >    dojo.addOnLoad(SetDnD);
> > > > > </SCRIPT>
> > > > >
> > > > > I am using 0.3.1 xdomain build hosted on AOL, on Firefox 1.5.x and
> > > > > 2.0. The files can be dragged around, but when i drop them on the
> > > > > tree, my DropOnTree handler is called with all empty objects and a
> > > > > message that says that the drop failed. I get the source DOM node OK
> > > > > though, so that part works. I have a feeling my problem is that i am
> > > > > not understanding properly how to set DndAcceptTypes for the tree and
> > > > > so the drop target is not properly recognized. It's also not clear
> > > > > how to set multiple data sources that can be dropped on the same
> > > > > target. I'd like to get the actual TreeNode object being dropped on.
> > > > >
> > > > > Please help, and i'll contribute the results back to the docs.
> > > > >
> > > > >
> > > > > Thanks,
> > > > > LDH
> > > > >
> > > > >    "A thought that doesn't try to become a word is not a worthy
> > > > > thought. A word that doesn't try to become an action is not a worthy
> > > > > word. " - Chesterfield
> > > > >
> > > > > Visit http://www.RatingMovies.com for movie madness
> > > > >
> > > > >
> > > > >
> > > > >
> > > > > _______________________________________________
> > > > > Dojo FAQ: http://dojo.jot.com/FAQ
> > > > > Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
> > > > > Dojo-interest at dojotoolkit.org
> > > > > http://dojotoolkit.org/mailman/listinfo/dojo-interest
> > > >
> > > > _______________________________________________
> > > > Dojo FAQ: http://dojo.jot.com/FAQ
> > > > Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
> > > > Dojo-interest at dojotoolkit.org
> > > > http://dojotoolkit.org/mailman/listinfo/dojo-interest
> > >
> > >_______________________________________________
> > >Dojo FAQ: http://dojo.jot.com/FAQ
> > >Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
> > >Dojo-interest at dojotoolkit.org
> > >http://dojotoolkit.org/mailman/listinfo/dojo-interest
> >
> > _______________________________________________
> > Dojo FAQ: http://dojo.jot.com/FAQ
> > Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
> > Dojo-interest at dojotoolkit.org
> > http://dojotoolkit.org/mailman/listinfo/dojo-interest






More information about the Dojo-interest mailing list