kendo window 有时关闭重新加载页面（不一致）

Question

我正在尝试在我的应用程序中绑定一个简单的 kendo window 打开和关闭功能。

以下是HTML模板：

<div id="edit-user-window">
    <div class="container">
        <div class="row">
            <div class="col-md-10">
                <form class="form-horizontal">
                    <div class="form-group">
                        <label for="firstname">First Name</label>
                        <input type="text" name="firstname" class="form-control" data-bind="value: editUser.FirstName">
                    </div>
                    <div class="form-group">
                        <label for="email">Email</label>
                        <input type="email" name="email" class="form-control" data-bind="value: editUser.Email" required>
                    </div>
                    <button type="submit" class="btn btn-default">Submit</button>
                    <button class="btn btn-default" data-bind="click: cancelEdit">Cancel</button>
                </form>
            </div>
        </div>
    </div>
</div>

数据绑定以这种方式完成

function Model(app, popUp) {
    var ko = kendo.observable({
        self: this,
        dataSrc: null,
        editUser: {},
        init: function () {
            // Set up data source
            self.dataSrc = new kendo.data.DataSource({
                data: [],
                transport: {read: {url:, dataType:}},
                schema: {
                    model: { Name: "FirstName", Email: "Email"}
                }
            });

            // Define the user table
            $("#userGrid").kendoGrid({
                dataSource: self.dataSrc,
                columns: [
                    { field: 'FirstName', title: 'Name' },
                    { field: 'Email', title: 'Email' },
                    {
                        field: 'Operations',
                        width: "152px;",
                        command: [
                            {
                                name: 'edit',
                                template:"<a class='k-grid-edit' href='#' style='border-right:1px solid black;padding:5px;'>Edit</a>",
                                click: function (e) {
                                    e.preventDefault();
                                    $("#edit-user-window").data("kendoWindow").center().open();
                                    var tr = $(e.target).closest("tr");
                                    self.set("editUser",this.dataItem(tr));
                                }
                            }
                        ]
                    }
                ]
            });

            $("#edit-user-window").kendoWindow({
                width: "80%",
                height: "80%",
                title: "Edit User",
                visible: false,
                actions: [
                    "Close"
                ]
            });
        },
        cancelEdit: function (e) {
            $("#edit-user-window").data("kendoWindow").center().close();
        },
    });

    return ko;
}

当我在单击按钮时使用 cancelEdit 函数关闭 window 时，window 有时会正常关闭，有时会刷新整个页面。没有有用的日志消息来调试问题。由于这将是一个单页应用程序，因此无法容忍重新加载。

潜在问题可能与 kendo 网格中的每一行都有编辑操作有关。

PS：我是 kendo 新手，所以该方法可能有缺陷。

Answer 1

如果您将按钮元素放入表单中，则当您单击它时默认会发送此表单。为了防止它添加 type="button" 属性到你的取消按钮。

<button class="btn btn-default" type="button" data-bind="click: cancelEdit">Cancel</button>

kendo window 有时关闭重新加载页面（不一致）

kendo window close reloads page sometimes (inconsistently)

mvvm

kendo-ui

kendo-window