在JSP文件中替换原生confirm为Kendo UI确认对话框

步骤1：确认Kendo UI资源已引入 #

确保你的JSP页面中已正确引入Kendo UI的CSS和JavaScript文件（需在jQuery之后加载）：

<!-- Kendo UI 基础样式 -->
<link rel="stylesheet" href="${pageContext.request.contextPath}/path/to/kendo.common.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath}/path/to/kendo.default.min.css" />

<!-- jQuery（Kendo UI 依赖） -->
<script src="${pageContext.request.contextPath}/path/to/jquery.min.js"></script>

<!-- Kendo UI 核心脚本 -->
<script src="${pageContext.request.contextPath}/path/to/kendo.all.min.js"></script>

步骤2：修改deleteRow函数 #

Kendo UI的kendo.confirm是异步方法（返回Promise对象），需将AJAX删除逻辑放到确认后的回调中，替换原生同步的confirm判断：

function deleteRow(rowdata) {
    // 弹出Kendo风格的确认对话框
    kendo.confirm("Are you sure want to delete this record ?")
        .then(function() {
            // 用户点击确认后执行删除操作
            if(finalRowval){
                $.ajax({
                    type : 'DELETE',
                    url : "${pageContext.request.contextPath}/mvc/abc" + finalRowval.id + "/xyz",
                    dataType : 'text/html',
                    data : "",
                    async : true,
                    // 可选：添加删除成功后的处理逻辑
                    success: function() {
                        console.log("记录删除成功");
                        // 这里可以添加刷新表格、提示用户等操作
                    },
                    // 可选：添加删除失败后的处理逻辑
                    error: function(xhr) {
                        console.error("删除失败", xhr);
                    }
                });
            }
        })
        .catch(function() {
            // 用户点击取消后的操作（可选）
            console.log("用户取消了删除操作");
        });
}

关键说明 #

• kendo.confirm触发的对话框，用户点击「确定」会执行then回调，点击「取消」会执行catch回调。
• 由于是异步操作，无法像原生confirm那样用if直接判断返回值，必须通过Promise回调处理后续逻辑。
• 可根据业务需求在AJAX的success/error回调中补充页面交互逻辑，比如刷新数据表格、显示操作提示等。

内容的提问来源于stack exchange，提问作者Adil