droppable

dropping an element only into the droppable that is in front

由 僤鯓⒐⒋嵵緔 提交于 2019-12-02 14:54:48
问题 I have some droppable areas, which are also draggable. It can happen that two or more droppable areas will get behind each other. Is there a way to drop a draggable item only into the area that is in the front? (z-index) The situation is now, that the item gets added to all the areas, that are overlapping. Thank you 回答1: Ok I have now a quite good solution and I want to share it with you guys... I have build a small plugin https://github.com/vaceta/jquery-top-droppable 来源： https:/

dropping an element only into the droppable that is in front

由 无人久伴 提交于 2019-12-02 10:53:32
I have some droppable areas, which are also draggable. It can happen that two or more droppable areas will get behind each other. Is there a way to drop a draggable item only into the area that is in the front? (z-index) The situation is now, that the item gets added to all the areas, that are overlapping. Thank you Ok I have now a quite good solution and I want to share it with you guys... I have build a small plugin https://github.com/vaceta/jquery-top-droppable 来源： https://stackoverflow.com/questions/16497873/dropping-an-element-only-into-the-droppable-that-is-in-front

Jquery Drag-Drop (Getting element being dropped into)

由 雨燕双飞 提交于 2019-12-02 09:58:29
I am trying to detect which cell an object is being dropped into. <table> <tr> <td class="weekday">Sun</td> <td class="weekday">Mon</td> <td class="weekday">Tue</td> <td class="weekday">Wed</td> <td class="weekday">Thu</td> <td class="weekday">Fri</td> <td class="weekday">Sat</td> </tr> <tr> <td class="droppable"> </td> <td class="droppable"> </td> <td class="droppable"> </td> <td class="droppable"> </td> <td class="droppable"> </td> <td class="droppable"> </td> <td class="droppable"> </td> </tr> </table> <div class="draggable">Drag Me</div> On drop, how do I determine which day the div was

Clone object is not droppable

由 泪湿孤枕 提交于 2019-12-01 11:16:05
I'm trying to clone a droppable object using Jquery but the cloned object is not droppable. $(document).ready(function(){ $("input[value='Add']").click(function(e){ e.preventDefault(); $("div.field:last").clone().insertAfter("div.field:last"); }); $(".field").droppable(); HTML <div class="field"> Last Name<input type="text" value="" /> First Name<input type="text" value="" /> </div> <div class="field"> Last Name<input type="text" value="" /> First Name<input type="text" value="" /> </div> <input type="Submit" name="submit" value="Add" /> Firebug shows that the cloned object has the class ui

Clone object is not droppable

由 南楼画角 提交于 2019-12-01 09:01:42
问题 I'm trying to clone a droppable object using Jquery but the cloned object is not droppable. $(document).ready(function(){ $("input[value='Add']").click(function(e){ e.preventDefault(); $("div.field:last").clone().insertAfter("div.field:last"); }); $(".field").droppable(); HTML <div class="field"> Last Name<input type="text" value="" /> First Name<input type="text" value="" /> </div> <div class="field"> Last Name<input type="text" value="" /> First Name<input type="text" value="" /> </div>

Fullcalendar: draggable object rejects fullcalendar as droppable even though fullcalendar accepts drop

由 有些话、适合烂在心里 提交于 2019-11-30 18:42:27
I have set up FullCalendar to accept drops, which it does. But the draggable object, which I have constructed with revert:'invalid' does not seem to recognize the dates on FullCalendar as droppable, and reverts back. Here is my code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html><head> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <title>mydrag</title> <script src="fullcalendar-bundle.js" type="text/javascript"></script> </head><body> <div id="mydrag" style="width: 200px; height: 100px; background-color: red;">My

Fullcalendar: draggable object rejects fullcalendar as droppable even though fullcalendar accepts drop

由 安稳与你 提交于 2019-11-30 16:52:52
问题 I have set up FullCalendar to accept drops, which it does. But the draggable object, which I have constructed with revert:'invalid' does not seem to recognize the dates on FullCalendar as droppable, and reverts back. Here is my code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html><head> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <title>mydrag</title> <script src="fullcalendar-bundle.js" type="text/javascript"><

How to get fullpath of dropped folder from file system

由 柔情痞子 提交于 2019-11-30 15:51:44
问题 I am trying to implement drag n drop in my application, which need the full path of folder being dropped. I have done something like this <html> <head> <style> #dropzone { height:200px; width: 200px; border: 10px dashed #0c0; background-color:cyan; } </style> </head> <body> <div id="dropzone" droppable="true" ondrop ="drop(event)" ondragenter="return false" ondragover="return false"> </div> <script type="text/javascript"> function drop(e) { e.stopPropagation(); e.preventDefault(); var length

jQuery UI remove element when dropped into a div using .droppable

由 会有一股神秘感。 提交于 2019-11-29 21:01:35
问题 I'm trying to figure out the logic of how to do this. I have many images with only a CSS class name, they are created dynamically. These images are draggable using jQuery UI's .draggable. I need to have a "trash can" that when an element is dragged into , it is removed. Example : http://jsfiddle.net/KWdcU/3/ (This is set to remove all elements and not the one dragged into it) Code : <div class ="box"> <div class="stack">one</div> <div class="stack">two</div> </div> <div id="trash">trash</div>

jquery droppable accept

由 不打扰是莪最后的温柔 提交于 2019-11-28 17:55:31
Can anyone tell me how I can write a function in accept condition and then how does it finds out that what to accept and what not to accept. For example, I want to accept div a and div b in accept condition. How can I write I through a function? If you want the droppable to accept a selection of elements you can do something like this: $(".droppable").droppable({ accept: function(d) { if(d.hasClass("foo")||(d.attr("id")=="bar")){ return true; } } }); This droppable will accept elements with the class "foo" or an element with the id "bar" If I understand your question correctly, you want to
订阅 droppable