[Dojo-interest] help regarding drag and copy

sonal kohok sonal_22dec at yahoo.co.in
Wed Feb 21 01:40:58 MST 2007


Hello,
    I m facing other new problem with my code. I m giving wipe in and wipe out functionality for my images. When i move wipe-out image, it gives an error "invalid argument". why is that error coming?? Here is my code.
   
  <script type="text/javascript">
  dojo.require("dojo.dnd.*");
  dojo.require("dojo.dnd.HtmlDragCopy");
  dojo.require("dojo.event.*");
  dojo.require("dojo.widget.Dialog");
  dojo.require("dojo.widget.ContentPane");
  dojo.require("dojo.widget.TabContainer");
  dojo.require("dojo.widget.LayoutContainer");
  dojo.require("dojo.widget.LinkPane");
  dojo.require("dojo.lfx.*");
  dojo.require("dojo.html.style");
  
  function byId(id){
  return document.getElementById(id);
  }
  var tar1;
  var trash,i=0;
  var dlg;
  function init()
  {
  document.body.ondrag = function () { return false; };
  
  var dl = dojo.byId("leftdiv");
  var lis = dl.getElementsByTagName("table");
  for(var x=0; x<lis.length; x++){
  new dojo.dnd.HtmlDragCopySource(lis[x], "left",x==x);
  }
  
  var dl = dojo.byId("rightdiv");
  tar1 = new dojo.dnd.HtmlDropTarget(dl, ["left","right"]);
  var lis = dl.getElementsByTagName("table");
  for(var x=0; x<lis.length; x++){
  new dojo.dnd.HtmlDragSource(lis[x], "right");
  }
  
  trash = new dojo.dnd.HtmlDropTarget(dojo.byId("trash"), ["*"]);
  trash.insert=function(e) {
  dojo.html.removeNode(e.dragObject.domNode);
  return(true);
  };
  
  
  dojo.event.connect(tar1,"onDrop",function(e) {
  i++; 
  var newid="copy"+i;
  var divid="div"+i;
  var clonedObj=e.dragObject.domNode;
  clonedObj.setAttribute("id",newid);
  var firsttd=clonedObj.getElementsByTagName("td")[0];
  firsttd.setAttribute('ondblclick',function(){dlg.show();});
  var firstdiv=clonedObj.getElementsByTagName("div")[0];
  firsttd.setAttribute('id',divid);
  alert(divid);
  var firstImage=clonedObj.getElementsByTagName("img")[0];
  firstImage.setAttribute('onclick',function(){ShowHide(divid,firstImage);});
  });
  dlg = dojo.widget.byId("DialogContent");
  var btn = document.getElementById("cancel");
  var btn1 = document.getElementById("hider");
  dlg.setCloseControl(btn);
  dlg.setCloseControl(btn1);}
  function minimisepanel(objDiv){
  dojo.lfx.html.wipeOut(dojo.byId(objDiv), 300).play(); }
  
  function maximisepanel(objDiv){
  dojo.lfx.html.wipeIn(dojo.byId(objDiv), 300).play(); }
  
  function ShowHide(objID,imgref){
  if (dojo.html.getComputedStyle(objID, 'display')=='block'){
  alert("if");
  minimisepanel(objID);
  imgref.src="images/uparr.gif"; }
  else{
  alert("else");
  maximisepanel(objID);
  imgref.src="images/downarr.gif";}
  return;
  }
  dojo.event.connect(dojo, "loaded", "init"); 
  </script> 
   
  this is body:
  <div id = "leftdiv" style="overflow: auto; HEIGHT: 100%; width: 200px; margin-left: 10%;" > 
  
  <table id ="w1" align="center" class="widgetTable">
  <tr class="widgetTitle">
  <th align="left" width="90%" class="tablehead">Segments </th>
  <th width="10%" >
  <img src="images/downarr.gif" onclick="ShowHide('l1',this)" align="baseline"/>
  </th> </tr><tr>
  <td width="100%" align="center" class="widgetTdCotent" colspan="2">
  <div id="l1" align="center" class="divstyle">
  <img src="images/fin0.jpg" width="100%" align="left"/> 
  </div></td></tr></table>
  
  <table id ="w8" align="center" class="widgetTable">
  <tr class="widgetTitle">
  <th align="left" width="90%" class="tablehead">Utilized Segments </th>
  <th width="10%" >
  <img onclick="ShowHide('l2',this)" src="images/downarr.gif" align="baseline"/>
  </th></tr>
  <tr class="widgetTitle">
  <td width="100%" align="center" class="widgetTdCotent" colspan="2">
  <div id="l2" align="center" class="divstyle">
  <img src="images/fin6.jpg" width="100%" align="left" /> </div></td></tr></table>
  </div>
  </td>
  <td height="500px" colspan="2" width="85%" >
  <div id="rightdiv" style="overflow: auto; HEIGHT: 100%; width: 95%; margin-left: 3%">
  </div>
   
  this the the popup dialog:
    <div dojoType="dialog" id="DialogContent" bgColor="white" bgOpacity="0.6" toggle="fade" toggleDuration="250" style="width: 500px; height: 600px; background-color: white;">
  <center>
  <input type="submit" id="hider" value="Save">
  <input type="submit" id="cancel" value="Cancel">
  </center>
  </div>
  Can anyone help me??


 				
---------------------------------
 Here’s a new way to find what you're looking for - Yahoo! Answers 
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://dojotoolkit.org/pipermail/dojo-interest/attachments/20070221/63fbf6dc/attachment.html
-------------- next part --------------
A non-text attachment was scrubbed...
Name: downarr.gif
Type: image/gif
Size: 581 bytes
Desc: 4098833510-downarr.gif
Url : http://dojotoolkit.org/pipermail/dojo-interest/attachments/20070221/63fbf6dc/downarr.gif
-------------- next part --------------
A non-text attachment was scrubbed...
Name: uparr.gif
Type: image/gif
Size: 610 bytes
Desc: 3222208956-uparr.gif
Url : http://dojotoolkit.org/pipermail/dojo-interest/attachments/20070221/63fbf6dc/uparr.gif


More information about the Dojo-interest mailing list