如何防止jquery验证表单只有一个按钮

how to prevent jquery validate form only one button?

本文关键字:有一个 按钮 表单 验证 何防止 jquery      更新时间:2023-09-26

我使用了KnockoutJS和Jquery Validate。如果我有一个按钮,它就完美地工作了。现在我想要另一个这样的按钮:

<button data-bind="jqueryui: 'button'">Submit</button>
<button data-bind="jqueryui: 'button'">Reset</button>

问题是:当点击重置按钮将输入字段重置为空时,它也会像提交按钮一样运行验证。单击重置按钮时如何防止验证?

我的代码:cshtml

<table>
<tr>
    <td valign="middle">
        Old Password
    </td>
    <td>
        <input id="oldPassword" name="oldPassword" type="text" data-bind="value: OldPassword, valueUpdate: 'afterkeydown'" />
    </td>
</tr>
<tr>
    <td valign="middle">
        New Password
    </td>
    <td>
        <input id="newPassword" name="newPassword" type="text" data-bind="value: NewPassword, valueUpdate: 'afterkeydown'" />
    </td>
</tr>
<tr>
    <td valign="middle">
        Confirm New Password
    </td>
    <td>
        <input id="confirmNewPassword" name="confirmNewPassword" type="text"
            data-bind="value: ConfirmNewPassword, valueUpdate: 'afterkeydown'" />
    </td>
</tr>
<tr>
    <td colspan="2">
        <button data-bind="jqueryui: 'button'">
            Submit</button>
        <button data-bind="jqueryui: 'button'">
            Reset</button>
    </td>
</tr>

KnockoutJs

if (!!$('form')) {
                    $('form').validate({
                        submitHandler: function () { params.viewModel.Presenter.CheckPassword(); },
                        rules: {
                            oldPassword: {
                                required: true,
                                minlength: 3
                            },
                            newPassword: {
                                required: true,
                                minlength: 3
                            },
                            confirmNewPassword: {
                                equalTo: '#newPassword'
                            }
                        },
                        messages: {
                    }
                });

将类型设置为按钮,重置将起作用。。。

<button type="submit" data-bind="jqueryui: 'button'">Submit</button>
<button type="reset" data-bind="jqueryui: 'button'">Reset</button>