Drag and Drop Images Into Web Folders

  • Hacker007
  • Proficient
  • Proficient
  • User avatar
  • Posts: 371
  • Loc: Riverside, CA

Post 3+ Months Ago

Hello all, I have come once again for some help on a web project I am currently Undertaking. I am working on an image hosting service for my message board users. Currently, users are able to upload images to the webserver, which are stored in individual folders labeled with their user id. I am looking to allow them to create subfolders, to which they can sort their uploads into. Does anyone know of a way I can create a drag'n'drop interface, which would allow the user to drag an image from their main directory, over a folder link and have the image be moved into that folder? (similar to the way windows or just about any FTP program allows you to do)

I can handle the PHP for moving the image, all I need help with is a dhtml/javascript/or ajax script that will recognize when an image is dropped over the folder link, and then send a request to the server to move the image.

I have searched google, and ozzu for topics/tutorials/ect that would help, but have been unsuccessful! If anyone knows how and can give me a script, ideas, or a tutorial that would be much appreciated!

If you need a better idea, I have saved this page so show you the general layout of the image gallery and folder display:

http://www.koolzone.net/imgstore/Example.html
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • northstjarna
  • Beginner
  • Beginner
  • northstjarna
  • Posts: 58
  • Loc: Chertsey, UK

Post 3+ Months Ago

Hi there,

I haven't figured this out yet but I have an idea...

Ok, are you listing the folders through a database or directly reading the file tree using a file directory listing?

I thought about this... employ javascript and make an ajax call when the item is registered over the disered location.. IE by passing the ID of one conatiner to the other and getting the directory name when one container is over the other...

So basically the variables you might need... ID, existing file/folder name, new_file/folder_name (IE the one hovered over) pass them through ajax on Mouseup to pass url variables in the ajax to an update SQL query using the new and old folder names and ID. IE where it came from and went too.

Could you use this tutorial??

http://www.webreference.com/programming ... k/column2/

Thanks

Andi
  • Hacker007
  • Proficient
  • Proficient
  • User avatar
  • Posts: 371
  • Loc: Riverside, CA

Post 3+ Months Ago

Thankyou for the reply!
The problem I am having is how to know when the dragged item is on top of my links. I looked at the tutorial posted and was unable to get any help from it unfortunately.

Post Information

  • Total Posts in this topic: 3 posts
  • Users browsing this forum: No registered users and 35 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.