Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

drag & drop

Status
Not open for further replies.

andreas57

Technical User
Sep 29, 2000
110
CH
hello i've got a small problem with the data object. i always get the dragged text with "undefined" at the end. why?

source frame:
<html>
<head>
<title>netBox</title>
<link rel="STYLESHEET" type="text/css" href="include/main.css">
<script>
ns4 = (document.layers)? true:false;
ie4 = (document.all)? true:false;
var tempX = 0
var tempY = 0
function getY(e) {
if (ie4) {
tempY = event.clientY + document.body.scrollTop
} else {
tempY = e.pageY
}

if (tempY < 0){tempY = 0}
return tempY-5;
}
function getX(e) {
if (ie4) {
tempX = event.clientX + document.body.scrollTop
} else {
tempX = e.pageX
}

if (tempX < 0){tempX = 0}
return tempX-180;
}
if (!ie4) document.captureEvents(Event.MOUSEMOVE)

function setStyleByTag(e, p, v, g) {
if(g) {
var elements = document.getElementById(e);
elements.style['top'] = p;
elements.style['left'] = v;
} else {
var sheets = document.styleSheets;
if(sheets.length > 0) {
for(var i = 0; i < sheets.length; i++) {
var rules = sheets.cssRules;
if(rules.length > 0) {
for(var j = 0; j < rules.length; j++) {
var s = rules[j].style;
ugly_selectorText_workaround();
if(allStyleRules) {
if(allStyleRules[j] == e) {
s['top'] = p;
s['left'] = v;
}
} else {
if(((s[p] != "") && (s[p] != null)) && (rules[j].selectorText == e)) {
s['top'] = p;
s['left'] = v;
}
}
}
}
}
}
}
}
function hide(id) {
if (ns4) document.layers[id].visibility = "hide";
else if (ie4) document.all[id].style.visibility = "hidden";
}
function show(id) {
setStyleByTag(id,getY(),getX(),1);
if (ns4) document.layers[id].visibility = "show";
else if (ie4) document.all[id].style.visibility = "visible";
}

</script>
</head>
<body>
<table width="100%" height="100%" cellspacing=0>
<tr height=20 class="title">
<td>PROJEKTE</td>
<td align=right><a href="#" class="greena" onmouseover="javascript:window.parent.setStyleByTag('div',85,520,1);window.parent.show('project');return false;" onmouseout="javascript:window.parent.hide('project'); return false;">| ?&nbsp;</td>
</tr>
<tr>
<td colspan=2 class="data"><table cellpadding=0 cellspacing=0 height="100%">
<tr height=5><td></td></tr>
<tr>
<td width=450 class="gray">PROJEKTE</td>
<TD class="dataLg" align=center width=80>TERMIN</TD>
<TD class="dataLg" width=80 align=center>WER?</TD>
</tr>
<tr>
<td><img ondragstart="return false" align=middle src="pics/1_projektopen.gif" border=0><a ondragstart="return false" href="/list.mod.php?name=Sielcity&pid=1">Sielcity</td>
<td class="dataL">&nbsp;</td>
<td class="dataL">&nbsp;</td>
</tr><tr>
<td><a ondragstart="return false" href="/list.mod.php?back=1"><img ondragstart="return false" align=middle src="pics/2_e_minus.gif" border=0></a><a ondragstart="return false" href="/list.mod.php?sid=1&name=Hauptgebäude 1. OG">Hauptgebäude 1. OG</td>
<td class="dataL">&nbsp;</td>
<td class="dataL">&nbsp;</td>
</tr><tr>
<td><img ondragstart="return false" align=middle src="pics/2_e_e.gif" border=0><div id="divDrag4" class="nofile" onmousemove="parent.handleMouseMove(4)" ondragstart="parent.handleDragStart('4§elektro.cad')">elektro.cad</div></td>
<td class="dataL">23.05.2004</td>
<td class="dataL"><a href="#" onmouseover="javascript:show('name4');return false;" onmouseout="javascript:hide('name4'); return false;">Oli</a><div class="tags" id="name4">Oliver Stahel, Arcade Solutions AG</div></td>
</tr> <TR>
<td></td>
<TD height="100%" class="dataL">&nbsp;</TD>
<TD class="dataL">&nbsp;</TD>
</TR>
</table>
</td>
</tr>
<tr>
<td class="footerL" colspan=2 height=32>Legende:<br>
<span class="nofile">Datei nicht verfügbar</span><br>
<span class="hinw">Aufgabe überfällig</span>
</td>
</tr>
</table>
<style>#divDrag4 {position: absolute;padding:0px;}</style>
</body>
</html>


drop frame:
<html>
<head>
<title>user</title>
<link rel="STYLESHEET" type="text/css" href="include/main.css">
<script>
function cancelEvent() {
window.event.returnValue = false;
}
function drop() {
document.frm.fileId.value=window.event.dataTransfer.getData("text");
document.frm.submit();
}
function handleDragEnter() {
cancelEvent();
}
function handleDragLeave() {
cancelEvent();
}
</script>
</head>
<body leftmargin=0 ondragenter="handleDragEnter()" ondragover="cancelEvent()" ondragleave="handleDragLeave()" ondrop="drop()">
<form method=post name="frm">
<input type=hidden name="action" value="add">
<input type=hidden name="fileId">
</form>
<table width="100%" height="100%" cellspacing=0>
<tr height=20 class="title">
<td>UPLOAD</td>
<td align=right><a href="#" class="greena" onmouseover="javascript:window.parent.setStyleByTag('div',340,545,1);window.parent.show('up');return false;" onmouseout="javascript:window.parent.hide('up'); return false;">| ?&nbsp;</a></td>
</tr>
<tr>
<td colspan=2 class="data"><table cellpadding=2 cellspacing=0 height="100%">
<tr height=5><td></td></tr> <tr>
<td width="50%" class="gray">ZU AKTUALISIEREN</td>
<TD class="dataLg">&nbsp;AKTUALISIEREN MIT</TD>
</tr>
<form name="form4" method=post>
<input type=hidden name="action" value="add_file">
<input type=hidden name="id" value="4">
<tr>
<td>elektro.cadundefined</td>
<td class="dataLg"><input type=hidden name=fileId><input type=image class="buttons" src="pics/choose.gif" onClick="javascript:parent.uploadtmp.document.frmUp.files4.click();fileId.value=parent.uploadtmp.document.frmUp.files4.value;document.form4.submit();"></td>
<td><a href="/up.mod.php?action=del&id=4"><img src="pics/del_1.gif" alt="ENTFERNEN" border=0></a></td>
</tr>
</form> <TR>
<td></td>
<TD height="100%" class="dataL">&nbsp;</TD>
</TR>
</table>
</td>
</tr>
<tr>
<td height=42 class="footer" colspan=2>Total: [ 1 Datei ]&nbsp;<br><img src="pics/shim.gif" width=1 height=19>
<input type=image class="buttons" src="pics/delAll.gif" onclick="window.location.href='/up.mod.php?action=delAll'"> <INPUT type=image class="buttons" onclick="javascript:parent.uploadtmp.document.frmUp.submit();" src="pics/up.gif">&nbsp;
</td>
</tr>
</table>
</body>
</html>

andreas owen
aowen@swissonline.ch
 

Where is the dragged text? Where are you dragging it to? Is the missing CSS neeed to help debug this issue?

Help us out a bit here!

Dan
 
i forgot to post the parent frame with the drag functions:

function handleMouseMove(tmp) {
if (window.parent.tree.event.button == 1) {
eval('parent.tree.document.all.divDrag' + tmp + '.dragDrop()');
}
}
function handleDragStart(tmp,tmp2) {
eval('window.parent.tree.event.dataTransfer.setData("text", "' + tmp + tmp2 + '")');
}


the drag text is: 4§elektro.cad
and it is triggerd by following command in the source frame: ondragstart="parent.handleDragStart('4§elektro.cad')"

andreas owen
aowen@swissonline.ch
 
I reconstructed frameset somehow and now script complains that tree.event doesn't exist. :E

What is strange about these functions: they are called through parent and eval() parent. How many nested frames you have?

Also, source frame contains NS/IE branches... while handleMouseMove() uses document.all (non-compliant way to access DOM element).
 
hi there,

the easiest way is to go to user:test pwd:test

here you can browse through the left tree and drag the element test_elektro.cad to one of the right frames

andreas owen
aowen@swissonline.ch
 
Just tested in IE6 - drag&drop works OK to both download/upload frames. No error messages, no "undefined" text labels. (?!?)

Mozilla says "Error: window.parent.tree.event has no properties (Line: 58)" when I mouse over text_elektro.cad.
 
sorry, that file done yesterday but not anymore, but the file "afg 1.2.1.cad" in "test1.2" still does it

andreas owen
aowen@swissonline.ch
 
you have to drop in in upload

andreas owen
aowen@swissonline.ch
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top