/    Sign up×
Community /Pin to ProfileBookmark

Identifying Drag and drop objects from Browser in Javascript

Hi,
I want to use the drag and drop concept in my web browser (IE 6.0).This is my scenario, I want to drag and drop objects(objects like Word,Excel,Outlookmail) to my web browser(where the web browser will have a container a div tag). After the element is dropped in my browser container (div tag), based on the type of object placed in the container, i have to automate it in the client side through javascript and save it in the server. To identify the type of object draged and dropped, it have to get the location from where the object was dragged.

I have developed the code based on the link
[url]http://www.webreference.com/programming/javascript/dragdropie/index.html[/url]

Is it possible to get path of the object through javascript. If so what will be code used. Please help me on this.

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@harumphSep 05.2007 — I've used this. It will accept a dropped string. I have it creating alerts so you can see it. Perhaps you can do something with this:

PLEASE NOTE: You're gonna have to drop a string like "folderfolderabc.doc"

[CODE]<html>
<head>
<title>Drop a File Here</title>

<script language="JScript">
<!--
function enterDrag() {
window.event.dataTransfer.getData('Text');
obj = window.event.dataTransfer.getData('Text');
//alert(obj);
myActiveXObject = new ActiveXObject("Scripting.FileSystemObject");
file = myActiveXObject.GetFile(obj);
alert("The file name is " + file.Name);
alert("The full path is " + file.Path);
endDrag();
}

function endDrag() {
window.event.dataTransfer.clearData();
}

function overDrag() {
window.event.returnValue = false;
}
//-->
</script>
</head>

<body>
<br><br><br><center><DIV ondragover="overDrag()" ondragenter="enterDrag()"><table>
<tr>
<td style="color: #FFFFFF; background-color: #FF0000; font-weight: bold; font-family: verdana,sans serif; font-size: 10pt; border: 1px solid #000000">DROP IT HERE</td>
</tr>
</table></DIV></center>
</body>
</html>
[/CODE]
×

Success!

Help @madhavan281981 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.6,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...