tags:

views:

73

answers:

2

Hi there guys,

I am using Jquery Drag and drop to move divs across a page and this works perfectly. however what i would like is on each one of the div containers is to have a close button which when clicks removes the div from where it is and places it in a pre-defined div at the bottom like a widget gallery.

How would this be accomplished? - below is my html.. thanks

Chris

<div class='column' id='leftcolumn'></div>

<div class='column' id='rightcolumn'>

    <div class='dragbox'>
      <span class='close'>Close</span>
Content In here
    </div>
</div>

<div class='column' id='widgetgallery></div>
A: 

Try:

$('.close').click(function(){
  $('#widgetgallery').append($(this).parent());
  $(this).parent().delete();
});

I dunno if the appending part will work tough.

Mathijs Henquet
Is there a method named delete in jQuery?
rahul
Yeah, you shouldn't need to `.remove()` it anyway... you've appended it
fudgey
thanks guys..ill try this and let you know :)
Chris
+1  A: 
$('div.dragbox > span.close').click(function(){
  $(this).parent().appendTo("#widgetgallery");
});
rahul