jQuery drag'n'drop multiple elements - javascript

I'm currently developing a web file browser using jquery and php.
One of my sub-tasks is to be able to select a couple of files/folders and drop them into another folder.
From my research I see that jquery ui has draggable and droppable which do the work at 80%.
What should be done to be able to select a couple of elements and drop them?
Can it be done with the existing draggable/droppable plugins from jquery ui?
If not can you recommend any plugins for jquery that can do the work?

How about http://www.myphpetc.com/2009/11/jquery-ui-multiple-draggable-plugin.html

This is by far the simplest solution that I've found to a multi-item drag and drop. It's by brianpeiris. He created a demo of it here in answer to the stackoverflow question grouping draggable objects with jquery-ui draggable. I just wish that I'd found it before I found all the other solutions.

Related

How to build a drag and drop script like this?

I have recently been using sitecake, I like the drag and drop interface of it for the content editor. Try the demo on their site for the visual editor.
I am wondering how can I build a 'local' script like this for my managing and creating articles for my site.
What I need is the drag and drop options like this and a button which onClick outputs the html of the current display.
I have been looking into jQuery DND, draggable and droppable, HTML5 contentEditable and edit-inplace.
But unfortunately, nothing yet.
Can someone help me with this? Or altest point me in the right direction?
Thanks in advance.
I am the developer behind SiteCake. The first version of SiteCake was developed based on GWT and jQuery/jQueryUI Droppable and Draggable. The current version is powered by GWT and GWT-DnD library.
I am not sure I understand clearly your question about getting the html code.
Check out jQueryUI Droppable and maybe even Draggable.
Droppable is certainly capable of what you're asking. All you would need to do is specify drop points, which is what sitecake does.

Sortable/draggable list items without jQuery UI (or jQuery at all?)

I've been looking for a Javascript plugin that would provide the same basic functionnality as jQuery UI Sortable. Wich is dragging and dropping items for reordering them. In my case those items are <li> tags.
Basically, I don't want to use jQuery UI because it's quite heavy and, as I don't need to support IE, I'm using Zepto instead of jQuery. So I don't want to load jQuery AND jQuery UI just for this. That being said, I could easily live with a working jQuery plugin and adapt it so it works with Zepto.
I've been looking for this for quite some time but can't seem to find anything.
Whilst this doesn't have the full functionaility as jQuery UI Sortable you might be able to use this Zepto - Drag and Drop plugin.
https://github.com/netotaku/zepto-drag-and-drop.js

Drag and Drop Functionality using JavaScript for an email client application

I need a drop and drag functionality for my email client application.
I have some e-mails in my Inbox, I want them to move to my user defined folders by using drag and drop functionality by using JavaScript.
Looking forward for your response.
Check out JQuery, a very nice wrapper for Javascript with many nice UI plugins, including drag and drop.
This page has tons of drag and drop demos. You can scroll through and pick the plugin that you like --> here
And particularly, this plugin is probably exactly what you're looking for http://jqueryui.com/demos/droppable/
YUI has some drag-and-drop APIs. http://developer.yahoo.com/yui/dragdrop/

Module Drag Boxes in JS

is there a library in javascript where i can let the user drag and drop boxes and configure? like igoogle.
Check out jQuery UI for jQuery. It has a Draggable class that will allow you to drag and drop elements.
Checkout this plugin Easy Widgets that was inspired by this tutorial on nettuts that goes over how to build an iGoogle like interface using jQuery in detail. The plugin's home page is down but the source code is available, and you can still see a demo of the nettuts tutorial in action here.
Check ScriptAculous to enable drag and drop
http://wiki.github.com/madrobby/scriptaculous/draggable
http://www.tutorialspoint.com/script.aculo.us/scriptaculous_drag_drop.htm

jQuery Select Plugin That Will Allow for Folder/File Structured Tiered Options?

Does anybody know of a jQuery plugin that will allow for what I'm calling "tiered options" within an HTML select element? By this I mean something similar to the folder/file structure system that you find on most Operating Systems. Here's a screen shot of what I'm talking about from Windows:
tiered select example http://www.glenmorefinancial.com/images/select_example.png
I'm not as much concerned with having the images. Just being able to have a Category and SubCategories within that category are what's important to me.
jQuery is preferred, but if there are any plain javascript options for this, that's cool too.
Thanks for any and all help.
Try one of these on for size.
This looks nice with support for Option groups
jQuery UI Selectmenu
If you do not mind using <ul> <li> You may want to try these flyout menus
There is a nice tree-view plugin: http://jquery.bassistance.de/treeview/demo/

Categories