Kendo ui jquery 按钮在 kendoWindow 内不可见

Question

当用户单击按钮时，我正在创建一个弹出窗口。 kendoWindow 应包含确定和按钮。

$("#dialog").kendoWindow({
    width: "300px",
    height : "300px",
    modal : true,
    title: "delete row?",
    actions:
            { 
                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
                            }
                        });
                    }
                }
            }
        
    }).data("kendoWindow").open().center();

上面的代码可以工作，但在 kendoWindow 内按钮不可见。请参阅下面的屏幕截图。

Answer 1

看看使用 Kendo 对话框而不是窗口，因为根据文档，Kendo 窗口仅支持关闭、刷新、最小化、最大化和固定操作。 （https://docs.telerik.com/kendo-ui/api/javascript/ui/window/configuration/actions）

您可以执行以下操作 - 注意：onDelete 函数并未 100% 完成，但应该可以让您上路：

function yourFunctionWhenUserClicksButton() {
    $("#dialog").kendoDialog({
        width: "300px",
        height: "300px",
        title: "Delete row?",
        closable: true,
        modal: true,
        content: "<p>Are you sure you want to delete this row?<p>",
        actions: [
            { text: 'Cancel', action: onCancel },
            { text: 'Delete', primary: true, action: onDelete }
        ]
    });
}

function onDelete(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
                }
        });
    }

}

链接到文档以获取更多信息：https://demos.telerik.com/kendo-ui/dialog/index