Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

Solved

Drag Drop a Copy in Jquery

Posted on 2009-07-15

jQuery

1 solution

Medium Priority

1,483 Views

Last Modified: 2012-05-07

In this example:
http://jqueryui.com/demos/droppable/#photo-manager

How would I make a copy of the photos when drag starts? I want to drag a clone of the original item, leaving the original item in its place. I do not want the picture to be deleted when moved to the 'trash' in other words.

See http://jqueryui.com/demos/droppable/#photo-manager

Open in new window

Comment

Question by:JayZeeBoy

[X]

Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

Help others & share knowledge
Earn cash & points
Learn & ask questions

Join The Community

2 Comments

LVL 2

Accepted Solution

by:SaWey

SaWey earned 500 total points

ID: 248632402009-07-15

You can use something like this:

// image deletion function
				var recycle_icon = '<a href="link/to/recycle/script/when/we/have/js/off" title="Recycle this image" class="ui-icon ui-icon-refresh">Recycle image</a>';
				function deleteImage($item) {
						var $list = $('ul',$trash).length ? $('ul',$trash) : $('<ul class="gallery ui-helper-reset"/>').appendTo($trash);
 
						$item.find('a.ui-icon-trash').remove();
						var copy = $item.append(recycle_icon).clone();
						copy.appendTo($list).fadeIn(function() {
							copy.animate({ width: '48px' }).find('img').animate({ height: '36px' });
						});
				}

Open in new window

Author Closing Comment

by:JayZeeBoy

ID: 316039222009-07-15

Suhweeeet! Perfect! Thank you!

Featured Post

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Delegation for dynamic elements using JQuery on()

Article by: Anthony

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…

jQuery

Chart.js - An Introduction

Article by: Rob

Introduction Chart.js, used properly, can visually add a difference to your charting applications. It engages your visitors and allows them to interact with data they otherwise wouldn't be able to without expensive and complicated systems. For this…

Introduction to jQuery (Part 1)

Video by: Jason

The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

Introduction to jQuery (Part 2)

Video by: Jason

The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…