submitHandler没有被触发,虽然它是有效的(submitHandler is not tr

2019-10-29 17:00发布

我Ajax化评论系统 ,所以当Post Comment按钮被点击Ajax调用由代替了原来的形式提交。 感谢我的其他问题.submit不起作用如果绑定对象是由AJAX刷新这个工程现在即使提交按钮被刷新。

现在我想在提交之前验证的形式,但我不能使它发挥作用。 该submitHandler选项不叫虽然形式是有效的。 该alert( "Valid: " + commentform.valid() ); 被触发后,原来不执行一个AJAX提交。

提交表单的JavaScript看起来像

jQuery(document).ready(function($){
        $('#content_container').on("submit","#commentform",function(){
                var commentform=$('#commentform'); // find the comment form

                console.log('Post Comment button was clicked');     


var validator = $("#commentform").validate({ 
    onsubmit: false,
    rules: { 
        author: "required", 
        email: { required: true, email: true }, 
        url: { url: true    }, 
        comment: "required" 
    }, 
    messages: { 
        author: "Please enter your name",   
        email: { required: "Please enter an email address", 
        email: "Please enter a valid email address" }, 
        url: "Please enter a valid URL e.g. http://www.mysite.com", 
        comment: "Please include your comment" 
    } ,

    submitHandler: function(form) {  // The jQuery.validate plugin will invoke the submit handler if the validation has passed.
            alert( "Valid (submitHandler): " + form.valid() );
            console.log("before exit");
            return;
            console.log("after exit");
        },
    invalidHandler: function(event, validator) {
            alert( "Valid (invalidHandler): " + form.valid() );
            console.log("before exit");
            return;
            console.log("after exit");
        }
});
alert( "Valid: " + commentform.valid() );
return;

        $.ajax({
            type: 'post',
            url: formurl,
            data: formdata,

可能有人建议如何使AJAX调用验证后提交表单?

Answer 1:

在这种情况下,你可以试试这个:

    jQuery(document).ready(function($){
         $('#content_container').on("submit","#commentform",function(){
             var commentform=$('#commentform'); // find the comment form

             console.log('Post Comment button was clicked');     


     var validator = $("#commentform").validate({ 
        onsubmit: false,
        rules: { 
            author: "required", 
            email: { required: true, email: true }, 
            url: { url: true    }, 
            comment: "required" 
        }, 
        messages: { 
            author: "Please enter your name",   
            email: { required: "Please enter an email address", 
            email: "Please enter a valid email address" }, 
            url: "Please enter a valid URL e.g. http://www.mysite.com", 
            comment: "Please include your comment" 
        } 
    });
    if (commentform.valid()){
        //Your ajax to post the form
        $.ajax({
                type: 'post',
                url: formurl,
                data: formdata,
    }
    else{
       //form is not valid.
    }
    return false;// stop the form submission and refresh the page.
  });

});

你不需要submitHandlerinvalidHandler如果手动验证表单发送Ajax请求。

这工作,但我建议你考虑一下当前的设计,看看是否有可能避免去除旧形式与新的形式和具有重新绑定.validate()再次每次。



文章来源: submitHandler is not triggered although it is valid