How to trigger jQuery drag() function manually? like $(element).trigger('drag');

Question

I have an img element which is draggable. Now I want to trigger the drag() event manually like how do we trigger 'click' event as $(element).trigger('click'). Thanks.

Here is the function definition that I have

$('#imgToUpload').draggable({
        drag: function(event, ui) {
            if (ui.position.top > 0) {
                ui.position.top = 0;
            }
            var maxtop = ui.helper.parent().height() - ui.helper.height();
            if ( ui.position.top < maxtop) {
                ui.position.top = maxtop;
            }
            if ( ui.position.left > 0) {
                ui.position.left = 0;
            }
            var maxleft = ui.helper.parent().width() - ui.helper.width();
            if ( ui.position.left < maxleft) {
                ui.position.left = maxleft;
            }
            ImageCropping.calculateCroppedCoordinates();
        }
    });

Move your code to a separate function and call that function in stead. That way you can execute that functionality wherever you'd like to. — pinowthebird, Feb 17 '16 at 13:53
Have you tried `$('#imgToUpload').trigger('drag')`? How specifically it failed to work? — Piskvor left the building, Feb 17 '16 at 13:58
Possible duplicate of: http://stackoverflow.com/questions/13883214/how-to-programmatically-invoke-jquery-ui-draggable-drag-start — pim, Feb 17 '16 at 14:03
@Piskvor I tried $('#imgToUpload').trigger('drag') But no error and no action. — John Britto, Feb 17 '16 at 14:06
@PimBrouwers I saw that question too that din't solve my problem. — John Britto, Feb 17 '16 at 14:08

pim · Accepted Answer · 2019-04-09T20:38:33.673

5

Here is jquery ui plugin

https://github.com/jquery/jquery-ui/blob/9e8e339648901899827a58e5bf919f7dda03b88e/tests/jquery.simulate.js

include that on the page and then simply use

$("#myElement").simulate('drag');

edited Apr 09 '19 at 20:38

answered Feb 17 '16 at 19:12

pim

12,019
6
66
69

How to trigger jQuery drag() function manually? like $(element).trigger('drag');

1 Answers1