How could you use Trigger to trigger jquery draggable start, drag, stop events?

If I have an object that is being dragged and has the Start, Drag, Stop functions, how would I start them?

the problem I think will cause problems is the arguments passed to the function.

I was not sure if there was an easy way to do this if some kind of simulation could be used, or if I should create a custom object that the function's e and ui attributes would be passed to.

I would write the code, but it is as simple as:

code:

var $a = $("<div />").append("Test Text").appendTo("body").draggable({
    start: function(e,ui){/*...*/},
    drag: function (e,ui){/*...*/},
    stop: function (e,ui){/*...*/}
});

      

I wanted to call functions and initially I thought:

$a.draggable("option", "start")();
$a.draggable("option", "drag")();
$a.draggable("option", "stop")();

      

I just did a quick code pass to see what arguments were used there.

start:   ui.position.top|left
drag:    ui.position.top|left
stop:    ui.position.top|left, eventArgs.ClientX, eventArgs.ClientY, eventArgs.target

      

They all have objects like scope, and this, but since it is properly bound to something causing the click will be different and just call the function without referencing the object at hand.

After looking at the functions, I MUST be able to simply create objects to pass to the OR triggered function as I dismissed it in the description above.

+1


source to share


1 answer


So, first the idea was Trigger. It will fire events related to the user being called.

The second option that I was told was applied. However, when applying inline js, scope is required ... because the scope does not match when called in arb. line of code. This does not apply to a floatable text field, but to a container it does the job.

First, I create a list of used arguments, as you saw above, and just apply that given the scope of the drop object.



var s = [null,{position:{top:0,left:0}}],
    d = [null,{}position:{top:0,left:0}],
    sto = [{ClientX:0, ClientY:0, target:""},{]]
$("#my_item").draggable("option", "start").apply($("#my_item"), s);
$("#my_item").draggable("option", "drag").apply($("#my_item"), d);
$("#my_item").draggable("option", "stop").apply($("#my_item"), sto);

      

This answer actually works as long as it passes in the correct amount and all the data required. I was not sure if there were any necessary hidden features etc. that I was not aware of.

+1


source







All Articles