jquery - showIn 导致表单验证

Question

我正在使用 kendo-ui 的 SPA 创建客户端 CRUD 屏幕。其中一项功能是允许用户更改密码，因此我设置了以下模板：

<script type="text/x-kendo-template" id="user-change-password">
    <div class="hpanel hblue">
        <div class="panel-heading hbuilt">
            <div class="panel-tools">
                <a class="showhide"><i class="fa fa-chevron-up"></i></a>
            </div>
            Change Password for <span data-bind="text: userViewModel.UserName"></span>
        </div>
        <div class="panel-body">
            <form class="container-fluid" id="user-change-password-form">
                <a class="k-button btn-xs m-b-md" data-bind="attr: {href: userHref}">
                    <i class="fa fa-arrow-left"></i>
                    Go Back
                </a>
                <div class="form-group">
                    <label for="change-password">New Password</label>
                    <input id="change-password" type="password" class="k-textbox" required="required" data-bind="value: password" />
                </div>
                <div class="form-group">
                    <label for="change-password-confirm">New Password Confirmation</label>
                    <input id="change-password-confirm" type="password" class="k-textbox" required="required" data-bind="value: passwordConfirmation" />
                </div>
                <div class="row">
                    <div class="col-md-12 form-group">
                        <button type="submit" class="k-button" data-bind="click: formSubmission">
                            <i class="fa fa-save"></i>
                            Save
                        </button>
                        <button type="reset" class="k-button">
                            <i class="fa fa-undo"></i>
                            Reset
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</script>

这样做的问题是，似乎每当路由器命中路由时都会调用 showIn 方法，它会导致表单尝试验证（导致输入以红色标出）。这是我用于路线的代码：

router.route("/edit/:userId/change-password", function (userId) {
    _viewModel.changePassword.set("userId", userId);
    layout.showIn(".layout-content", changePasswordInterface);
});

我该如何做到这一点，以便每当用户访问该路线时，它不会在不使用另一个第三方库的情况下尝试提交表单？

标签： jquerykendo-ui