jQuery Validate确定表单提交中使用的按钮

时间:2013-01-30 20:39:34

标签: jquery jquery-validate

我正在尝试确定按钮是否用于提交表单。

我有两个按钮 - 在表单中取消和提交,根据点击哪一个,我想在提交之前执行一些功能。

我可以在服务器端确定POST的值,但需要先在客户端

执行此操作

我可以调用什么jquery函数来确定是否使用了“取消”按钮?

表单的提交正在作为jquery验证的submitHandler事件的一部分进行处理。

这是元素:

<input name="submit" type="submit" value="Submit" />
<input name="cancel" type="submit" value="Cancel" />

这是提交处理程序:

submitHandler: function(form) {
                    form.submit();
                    }

由于

2 个答案:

答案 0 :(得分:1)

试试这个......

   $('#myform').validate({
        rules: {
            field1: {
                required: true,
                minlength: 5
            },
            field2: {
                required: true,
                minlength: 5
            }
        },
        submitHandler: function (form) { // for demo
            alert('form submitted');
            return false;
        }
    });

    $(':submit').on('click', function () {
        if ($(this).attr('name') == 'submit') {
            $(this).closest('form').submit();
        }
    });

    $('[name="cancel"]').click(function () {
        // your code that handles a cancel click
        alert('form cancelled');
        return false;
    });

直播Example

问候。

答案 1 :(得分:1)

由于插件已经自动使用click自动捕获submit click事件,因此您不希望在jQuery Validate插件中使用外部或其他submitHandler处理程序,这是正确的。回调。

你的问题是你没有真正的“取消”按钮。这只不过是一个重复的submit按钮......

<input name="cancel" type="submit" value="Cancel" />

无论你做什么,该插件总是将其click事件视为常规表单提交。如果您将其更改为<button></button>怎么办?仍然没有好处。该插件还将button的{​​{1}}事件视为常规表单提交。此插件内置的其他回调函数/选项可以捕获任何其他类型的按钮/取消click事件。

您唯一的选择是将放在<{1}}标记的之外。 Valdiate插件不会看到它,然后您可以将自己的click事件绑定到它。

您自己的<form></form>点击事件:

click

使用cancel进行演示:http://jsfiddle.net/wZwcQ/

使用$('[name="cancel"]').click(function() { // your code that handles a cancel click }); 进行演示:http://jsfiddle.net/h7XKc/