Problem using jquery UI droppable and livequery!

Question

I have this code for some elements to be dropped

var $tab_items = $("ul:first li",$tabs).droppable{ tolerance: 'touch' ,....

and it´s work ok, but the problem it´s when I load another button by ajax or by javascript, don´t work because the new element don´t have binding for this event.

In other similar situation I found a solution using livequery (event delegation), but here it´s imposibble because I don´t want to attach a function, I want to attach the same that on the first line code.

Any solution better than making dropabble after every new object load?

This is my function: on drop inside move some content: var $tab_items = $("ul:first li",$tabs).droppable({ tolerance: 'touch' , drop: function(ev, ui) { var $item = $(this); var $list = $($item.find('a').attr('href')).find('.connectedSortable'); ui.draggable.hide(300, function() { $tabs.tabs('select', $tab_items.index($item)); $(this).appendTo($list).show('slow'); }); } This is a big function to copy or to execute many times (like the second answer just down) I need that when I add another div or button, it´s has the same "dropping" behaviour — , Aug 28 '09 at 04:07

score 0 · Answer 1 · answered Aug 28 '09 at 02:55

Just add the handler in your ajax success callback.

$.ajax({
   url: ...
   ...
   success: function(data) {
        $('<li>....</li>').droppable( { tolerance: 'touch', ... } )
                          .appendTo( '#tabs ul:first' );
        ...
   }
   ...
});

score 0 · Answer 2 · answered Aug 28 '09 at 03:03

0

This might be a wrong hunch but you might want to look at: http://docs.jquery.com/UI/Sortable

answered Aug 28 '09 at 03:03

David

2,715
2
22
31

Problem using jquery UI droppable and livequery!

2 Answers2