How do I trigger the Drop event with jQuery UI Droppable without actually dragging and dropping?

Question

I have a droppable with a drop event handler:

$(this).droppable({
  drop:function(){
    console.log(\'OMG You Dropped It!\');
  }
});


        

Answer 1

You can trigger the function associated with the drop call via the option-method:

$("#droppable").droppable({
        drop: function(event, ui) {
            do stuff }
    });
var drop_function = $("#droppable").droppable.option('drop');
drop_function();

This way you get whatever would happen when dropping something on droppable. Of course you could just execute the function instead of assigning it. It's nonetheless a good idea to assign a function to drop, that you define somewhere else, just for clarities sake.

Answer 2

As pointed by StuperUser and based on ajmurmann's answer, with the recent versions of jQuery you should do:

$("#droppable").droppable({
    drop: function(event, ui) {
        do stuff }
});
var drop_function = $("#droppable").droppable('option', 'drop');
drop_function();

Answer 3

You should move the code in your drop handler to a separate function.
You can then call the function both in the handler and elsewhere.