CODEWITHSUNDEEP
javascriptjqueryeventsdrag-and-dropkendo-ui
Aremyst
Aremyst

Reputation: 1528

Kendo draggable - suspend dragging temporarily from drag event handler

It should be an easy question

So, I have a really simple kendoDraggable:

grid.kendoDraggable({
        . . .
        axis: "y",
        hint: getHint,
        drag: drag,
        dragend: dragend,
        dragstart: dragstart,
    });

I need to test for my condition in 'drag' handler and prevent dragging if condition is true(so it's not possible to go beyond some dynamically calculated border). But user should be able to still drag it to another direction if he hadn't released the mouse even if he tried to drag beyond that border.

If I'm trying to stop propagation of event, it doesn't work:

    function drag(e) {
        if (e.clientY < someDynamicValue) {
            e.preventDefault();
            e.stopImmediatePropagation();
            e.stopPropagation();
            return false;
        }

But, if I just throw any exception it works exactly like I want it to. It doesn't drag if condition is true, but drags if condition is false:

        function drag(e) {
        if (e.clientY < someDynamicValue) {
            throw "any exception";
        }

What's going on? How to really stop dragging if condition is true?

Thanks!

P.S. I know about 'container' kendoDraggable property which constraints draggable object, but it works poorly with scroll.

Upvotes: 1

Views: 1989

Answers (1)

Rick Mortensen
Rick Mortensen

Reputation: 343

The best way to constrain the drag/drop operation is by filtering using a Jquery selector. To dynamically constrain the move, you can then add/remove classes from html elements asynchronously. In the following example, the user can only drag over grid rows, but can't drag over the current cell being edited. Hope this helps!

$("tbody").kendoDraggable({
    container: $("#Goals"),
    filter: "tr td:not(.k-edit-cell)",  
    hint: (item) => this.dragHint(item),
    drag: (e) => this.dragging(e)
});

Upvotes: 1

Related Questions