Kendo UI jQuery按钮在KendoWindow中无法显示的问题

问题原因 #

你代码里使用的actions配置项是KendoWindow标题栏操作按钮的配置（比如关闭、最小化这类按钮），并非用来添加弹窗内部的确认按钮，所以按钮不会显示在弹窗内容区域。

解决方案 #

方案1：改用Kendo Dialog组件（推荐，专门用于确认类弹窗）

Dialog组件原生支持确认按钮配置，更贴合你的需求：

$("#dialog").kendoDialog({
    width: "300px",
    height: "300px",
    modal: true,
    title: "delete row?",
    content: "确定要删除该行吗？",
    actions: [
        {
            text: '取消',
            action: function(e) {
                this.close();
            }
        },
        {
            text: 'Delete',
            primary: true,
            action: function(e) {
                // Delete action confirmed
                if(rowdata){
                    $.ajax({
                        type: 'DELETE',
                        url : "${pageContext.request.contextPath}/mvc/abc/service/" + finalRowval.id + "/xyz",
                        dataType: 'text/html',
                        data: "",
                        async: true,
                        success: function(response) {
                            // Handle success response
                        },
                        error: function(xhr, status, error) {
                            // Handle error response
                        }
                    });
                }
                this.close();
            }
        }
    ]
}).data("kendoDialog").open().center();

方案2：在Kendo Window中自定义内容区域的按钮

如果坚持使用KendoWindow，可以通过content配置添加自定义按钮，再绑定点击事件：

$("#dialog").kendoWindow({
    width: "300px",
    height: "300px",
    modal: true,
    title: "delete row?",
    content: `
        <div style="padding: 20px;">
            <p>确定要删除该行吗？</p>
            <button id="cancelBtn" class="k-button">取消</button>
            <button id="deleteBtn" class="k-button k-primary">Delete</button>
        </div>
    `,
    open: function() {
        // 绑定取消按钮事件
        $("#cancelBtn").on("click", () => {
            this.close();
        });
        // 绑定删除按钮事件
        $("#deleteBtn").on("click", () => {
            if(rowdata){
                $.ajax({
                    type: 'DELETE',
                    url : "${pageContext.request.contextPath}/mvc/abc/service/" + finalRowval.id + "/xyz",
                    dataType: 'text/html',
                    data: "",
                    async: true,
                    success: function(response) {
                        // Handle success response
                    },
                    error: function(xhr, status, error) {
                        // Handle error response
                    }
                });
            }
            this.close();
        });
    }
}).data("kendoWindow").open().center();

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