javascript - In a Kendo Grid, how I do disable dragging while doing an inline edit? - Stack Overflow

admin管理员组

文章数量:1415484

I've got a kendo grid with a draggable attached to it to allow reordering of grid rows.

        grid.table.kendoDraggable({
            filter: "tbody > tr",
            group: "gridGroup",
            hint: function (e) {
                return $('<div class="k-grid k-widget"><table><tbody><tr>' + e.html() + '</tr></tbody></table></div>');
            }
        });

        grid.table.kendoDropTarget({
            group: "gridGroup",
            drop: function (e) {
                e.draggable.hint.hide();
                var target = dataSource.getByUid($(e.draggable.currentTarget).data("uid")),
                    dest = $(document.elementFromPoint(e.clientX, e.clientY));

                if (dest.is("th")) {
                    return;
                }

                dest = dataSource.getByUid(dest.parent().data("uid"));

                if (target.get("Id") !== dest.get("Id")) {
                    var tmp = target.Priority;
                    target.Priority = dest.Priority;
                    dest.Priority = tmp;

                    dataSource.sort({ field: "Priority", dir: "asc" });
                }
            }
        });

I also have the ability to do inline edits by setting

editable: "inline"

and

{
    mand: ["edit"]
}

However, Kendo grid does some screwing things when dragging is enabled while trying to click on an editable field. When I ment out the kendoDraggable code, editing works just fine. I'm looking for a way of capturing the kendoGrid "edit" mand and using that to disable the draggability. Of course, I'd need to re-enable dragging after the user leaves inline editing mode.

Any thoughts?

I've got a kendo grid with a draggable attached to it to allow reordering of grid rows.

        grid.table.kendoDraggable({
            filter: "tbody > tr",
            group: "gridGroup",
            hint: function (e) {
                return $('<div class="k-grid k-widget"><table><tbody><tr>' + e.html() + '</tr></tbody></table></div>');
            }
        });

        grid.table.kendoDropTarget({
            group: "gridGroup",
            drop: function (e) {
                e.draggable.hint.hide();
                var target = dataSource.getByUid($(e.draggable.currentTarget).data("uid")),
                    dest = $(document.elementFromPoint(e.clientX, e.clientY));

                if (dest.is("th")) {
                    return;
                }

                dest = dataSource.getByUid(dest.parent().data("uid"));

                if (target.get("Id") !== dest.get("Id")) {
                    var tmp = target.Priority;
                    target.Priority = dest.Priority;
                    dest.Priority = tmp;

                    dataSource.sort({ field: "Priority", dir: "asc" });
                }
            }
        });

I also have the ability to do inline edits by setting

editable: "inline"

and

{
    mand: ["edit"]
}

However, Kendo grid does some screwing things when dragging is enabled while trying to click on an editable field. When I ment out the kendoDraggable code, editing works just fine. I'm looking for a way of capturing the kendoGrid "edit" mand and using that to disable the draggability. Of course, I'd need to re-enable dragging after the user leaves inline editing mode.

Any thoughts?

• javascript
• jquery
• kendo-ui

Share Improve this question Follow asked Feb 27, 2013 at 15:03 jermnyjermny 88022 gold badges1212 silver badges2323 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

You can just make the filter to exclude a row which is being currently edited.

grid.table.kendoDraggable({
  filter: "tbody > tr:not(.k-grid-edit-row)",

Here is live example.

本文标签： javascriptIn a kendo gridhow I do disable dragging while doing an inline editStack Overflow