Kendo UI Grid：如果有任何未决更改，则无法拦截和取消排序事件

Posted 2023-05-07

【中文标题】Kendo UI Grid：如果有任何未决更改，则无法拦截和取消排序事件

【英文标题】：KendoUI Grid: Cannot intercept and cancel sort event if there are any pending changes

【发布时间】：2013-08-22 20:01:32

【问题描述】：

浏览器：IE 9

上下文：填充了可编辑、可排序（服务器端）的 KendoUI 网格。

问题：目标是在有任何未保存的更改时弹出消息。

用户点击一个单元格 用户编辑单元格中的文本 用户点击列标题

网格的数据源没有捕捉到编辑。数据项的脏属性为假。 Kendo UI 网格始终对列进行排序。我一直无法找到拦截排序事件并警告用户并取消排序事件的方法。

感谢任何帮助。

【参考方案1】：

版本：kendoui.aspnetmvc.2013.2.716

为了取消排序事件，在数据源的requestStart事件中调用event.preventDefault()。

数据源的hasChanges()方法如果返回false

网格列是可重新排序的。 (.Reorderable(r => r.Columns(true)) //剑道htmlhelper代码） 排序在服务器上完成 用户编辑单元格中的文本并单击列标题

如果删除 Reorderable 设置，数据源的 hasChanges() 方法返回 true。 打开此问题的支持票。

同时，如果您想在用户编辑单元格并单击列标题时使用 hasChanges() 方法捕捉编辑，请不要将 Reorderable 设置为 true。

【参考方案2】：

这是一个演示KendoUI Grid issue的视频

来自 Telerik 的回应

基本上这是因为重新排序时使用的事件是 mousedown 事件。 当触发 mousedown 事件时，模型仍未更新。

作为一种变通方法，我可以建议您采用以下解决方案：

在初始化 Grid 后将其放入脚本块中。这样，如果 Grid 仍处于编辑模式，无论您是否进行了更改，都将阻止拖动。

$(function () 
    var gr = $('#Grid').data().kendoGrid;
    gr.thead.on('mousedown', function (e) 
        if (gr.tbody.find('.k-edit-cell').length) 
            e.stopImmediatePropagation()
        
    );
)

【讨论】：

在事件中添加这个if ($(e.target).hasClass("k-link"))，以防止从thead 内不是仪表区域的其他任何地方获得点击。