JQuery - 未按预期提交表单

时间:2012-04-30 14:29:01

标签: jquery forms submit form-submit

我写了一个简单的脚本来验证jQuery中的表单。 这些是提交按钮:

<button type="submit" id="submitCrear"  name="submitCrear">Confirm</button> ---->Cancel button
<button type="submit" value="cancelar"  name="cancelar" id="btnCancelar">Cancel</button> ---->Confirm button

按下“取消”按钮后,应发送表单而不进行任何验证。应该通过确认按钮发生压力。

但这是我不明白的:当我按下确认按钮时,验证过程正常启动,但是我按下取消按钮并且在所有验证完成之前不会发送表单(isValidForm变量变为'true “)。

<script type="text/javascript"> 
    var isValidForm;
    $(document).ready(function() {              
        $('#btnCancelar').click(function () {
            $('form').submit();
        });

        $('#submitCrear').click(function () {
            $('form').submit(function(){
                return validarForm();
            });
        });
    });

    function validarForm(){
        isValidForm = true;
        $("input:text").each(function(i) {
            if(this.value == ''){
                if (!$("#errorMessage"+i).length > 0)
                    addErrorMessage(this, i, '*REQUERIDO');
                isValidForm = false;
            }else{
                removeErrorMessage(this, i);
            }
        });
        $("input:password").each(function(i) {
            if(this.value == ''){
                if (!$("#errorMessage"+(i+999)).length > 0)
                    addErrorMessage(this, (i+999), '*REQUERIDO');
                isValidForm = false;
            }else{
                if(($(this).attr('id') == 'rePassword_r') && ($(this).val() != $("#password_r").val())){
                    if ($("#errorMessage"+(i+999)).length > 0){
                        removeErrorMessage(this, (i+999));
                        addErrorMessage(this, (i+999), 'The password doesn't match.');
                    }
                    isValidForm = false;
                }else{
                    removeErrorMessage(this, (i+999));
                }
            }
        });
        return isValidForm;
    }

    function addErrorMessage(element, indice, mensaje){
       ...

    }

    function removeErrorMessage(element, indice){
        ...
    }
</script>   

即使验证过程开始,我还应该怎么做才能使用取消按钮发送表单?

提前致谢!

1 个答案:

答案 0 :(得分:1)

你有两个按钮和以下jQuery

    $(document).ready(function() {              
    $('#btnCancelar').click(function () {
        $('form').submit();
    });

    $('#submitCrear').click(function () {
        $('form').submit(function(){
            return validarForm();
        });
    });
});

jQuery的后半部分意味着当提交表单时,它将被验证,因为您已将验证分配给表单提交,而不是单击按钮。这就是为什么它现在在两个按钮上被激活。

按设计,不提交类型的按钮,提交表格无论如何?所以你不应该只是将你的jQuery改为:

 $(document).ready(function() {              

    $('#submitCrear').click(function () {
            return validarForm();
    });
});