Jack_of_All_Trades
Jack_of_All_Trades

Reputation: 11468

Setting one callback for multiple events in jquery-UI

This might be a silly question to ask if I am missing a key point. I want to create a draggable which is resizable too. I don't know what is the proper way to do it but I did something like this:

$('#MYID').resizable();
$('#MYID').draggable();

Now I want to move it to some position and when everything is finalized save the position using: $('#MYID').ui-position. I am not sure how to implement the callback function in this case. If I use callback in like this:

$('#MYID').resizable();
$('#MYID').draggable()(Function()({....callback code for ui-position})

This is okay if the user does not resize the draggable after placing it in one position but what if he does?

How can I set one callback happening after the completion of two events?

Upvotes: 0

Views: 236

Answers (3)

scottm
scottm

Reputation: 28703

Because jQuery objects are chainable, to make you element both draggable and resizable, you can do this:

$('#MYID').resizable().draggable();

Then, it doesn't really matter if you call the same event handler twice because you only want to save the final position. So, you can just register both events like this:

$('#MYID').on('resizestop dragstop', function(event, ui) { 
                                        alert(ui.offset);  /* or whatever */
                                    }

Upvotes: 0

Travis J
Travis J

Reputation: 82267

Have them both set a flag, and then use a conditional that if both flags are set call the completion function

var flagA = 0;
var flagB = 0;
...
completeResize:
 flagA = 1;
 if(flagA && flagB)completionFunction();
...
completeDraggable:
 flagB = 1;
 if(flagA && flagB)completionFunction();

Upvotes: 1

Dmitry Savy
Dmitry Savy

Reputation: 1067

There's an interesting plugin called eventstack. It lets you bind events to either the top or the bottom of the event queue. I don't know how general your problem is, or whether you're looking to reverse or to arbitrarily order events in your stack, but the plugin may simplify your task.

Upvotes: 0

Related Questions