【问题标题】:Jquery Validation with Email使用电子邮件进行 Jquery 验证
【发布时间】:2012-04-05 10:10:53
【问题描述】:

我可以在点击按钮时验证表单而不使用 jquery http://bassistance.de/jquery-plugins/jquery-plugin-validation/ 的验证插件提交整个表单

这个插件非常适合表单验证,但实际上我想检查写在文本框中的文本是否是电子邮件,如果是电子邮件,那么我必须检查它是否在我的数据库中在我的数据库中,它将让用户提交表单,否则现在禁用按钮我正在使用验证插件,如下所示:

$('#child1Email').blur(function(){
    var result=$('#frmAddChild').validate();
    alert(result);
    //if(result)
       //Ajax call to my servlet
    //else
       //Message box showing wrong  email and disabling the submit button
}); 

PS 我用 id :: child1Emailtext fieldclass 保留为 email 以便将其作为电子邮件进行验证

<form name='frmAddChild' id='frmAddChild' action='addChild' method='post'>
     .
     .
     .
     .
     .
     <input type="text" name="child1Email" id="child1Email" class='email'/>
     .
     .
     .
     .
     .
</form>

但是当我 alert 结果显示 [object Object]

提前致谢

【问题讨论】:

    标签: jquery jquery-validate


    【解决方案1】:

    您可以轻松创建您自己的验证规则,而不是在新的代码块中使用魔法。

    类似这样的:

    <input type="text" 
           name="child1Email" 
           id="child1Email" 
           class="email"
           />
    

    使用 jQuery Validation Plugin,您可以将自定义代码编写为:

    $("form").validate({    
        rules: {      
            child1Email: {        
                required: true,        
                remote: "validate-email.jsp"      
            }    
         },
         messages: {
             child1Email: "Email is correct."   
             },
             submitHandler: function() {
                 alert("Correct email!");
             },
             success: function(label) {
                 label.addClass("valid").text("Valid email!")
             },
             onkeyup: false
    });
    

    remote 选项将以这种格式向您发送GET 请求:

    validate-email.jsp?child1Email=abc%40domain.com 
    

    您在哪里发回 truefalse,具体取决于您要做出什么反应。

    加上,您可以随时自己调用验证,例如:

    $("form").submit(function() {
    
        if($("form").valid()) { 
            alert('valid form'); 
            return true; // submit automatically
        }
        else { 
            alert('form is not valid'); 
        }
    
        return false; // no need to submit automatically
    });
    

    【讨论】:

    猜你喜欢
    • 2011-01-31
    • 2013-12-21
    • 1970-01-01
    • 2018-06-01
    • 2015-08-26
    • 1970-01-01
    • 2011-08-12
    相关资源
    最近更新 更多