如果验证成功，如何提交表单 [英] how to submit form only if validation is success

问题描述

我试图在提交请求之前验证表单。
我正在使用jquery验证

我期待页面完成加载时，表单会自动提交，并且我会在div中看到加载。
但没有发生
这里是我的代码。但似乎它不工作..

 < script type =text / javascript> 
 $ b函数submitForm（）{
 $（'＃SearchForm'）。validate（{
 errorLabelContainer：#ErrorLabel，
 rules：{
工具：{
 required：true，
 maxlength：10 
} 
}，
消息：{
 maxlength：不能超过10个字符 ，
 required：不能为空
}，
 
 submitHandler：function（）{$（'＃SearchForm'）。submit（）;} 
 }）; 
 
 $ b $（document）.ready（function（）{
 $（'＃SearchForm'）。submit（function（）{
 $（' （'Loading ...'）; 
}）; 
 submitForm（）; 
}）; 
< / script> 
  

ll

解决方案 div>

制作了一个小型工作演示 http://jsfiddle.net/CRfuZ/

2件事：尝试将 invalidHandler 并传递给 form submitHandler





maxlenght 10 invalidHandler 中的halbert会捕获它。

休息随意玩

这将有助于：

链接： http://docs.jquery.com/Plugins/Validation/validate

$ p
$ b $ $ $ $ $ $ $ $ $ $ $ $ $ $' #form）。validate（{
debug：false，
focusInvalid：false，
onfocusout：false，
onkeyup：false，
onclick：false，
规则：{
instrument：{
required：true，
maxlength：10
}，
}，
消息：{
maxlength：必须不超过10个字符，
要求：不能为空
}，
成功：函数（标签）{
alert（'succes：'+ label）;
}，
submitHandler：function（form）{
alert（'start submitHandler'）;
postContent（'test'）;
alert（'end submitHandler'）;
}，
invalidHandler：function（form，validator）{
alert（'invalidHandler'）;
}，
}）;
}）;


函数postContent（postData）{
alert（'postcontent：'+ postData）;

}

i try to validate the form before submitting the request. i am using jquery validation

i am expecting when page finish load, the form will auto submit, and i will see "Loading" in the div. but nothing happen here is my code. but seems it is not working..

<script type="text/javascript">

    function submitForm() {
        $('#SearchForm').validate({
            errorLabelContainer: "#ErrorLabel",
            rules: {
                instrument: {
                    required: true,
                    maxlength: 10
                }
            },
            messages: {
                maxlength: "Must no longer than 10 characters",
                required: "Must not be empty"
            },

            submitHandler: function () { $('#SearchForm').submit(); }
        });
    }

    $(document).ready(function () {
        $('#SearchForm').submit(function () {
            $('#DivToUpdate').text('Loading ...');
        });
        submitForm();
    });
</script>

ll

解决方案

Made a small Working demo http://jsfiddle.net/CRfuZ/

2 things: try putting invalidHandler and pass form to the submitHandler

In the demo above if you will enter more then maxlenght 10 the halbert in invalidHandler will capture it.

Rest feel free to play around with the demo.

This will help hopefully :)

link: http://docs.jquery.com/Plugins/Validation/validate

COde

jQuery(function($) {
    $("#form").validate({
        debug: false,
        focusInvalid: false,
        onfocusout: false,
        onkeyup: false,
        onclick: false,
        rules: {
            instrument: {
                required: true,
                maxlength: 10
            },
        },
        messages: {
            maxlength: "Must no longer than 10 characters",
            required: "Must not be empty"
        },
        success: function(label) {
            alert('succes:' + label);
        },
        submitHandler: function(form) {
            alert('start submitHandler');
            postContent('test');
            alert('end submitHandler');
        },
        invalidHandler: function(form, validator) {
            alert('invalidHandler');
        },
    });
});


function postContent(postData) {
    alert('postcontent: ' + postData);

}


​

这篇关于如果验证成功，如何提交表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！