Jquery表单验证未显示错误消息

时间:2012-05-28 15:02:17

标签: jquery jquery-plugins jquery-validate

我正在尝试使用jquery验证我的表单,但我无法使其工作。当我点击提交时,它不会显示任何错误消息。

你能告诉我问题在哪里吗?

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
 <script type="text/javascript" src="validation.js"></script>

 <script>
 $(document).ready(function() { 
// validate signup form on keyup and submit 
var validator = $("#signupform").validate({ 
    rules: { 
        fname: "required", 
        lname: "required", 
        username: { 
            required: true, 
            minlength: 2, 
            remote: "<? echo base_url();?>mycontroller/function" }
       }, 
    messages: { 
        fname: "Enter your firstname", 
        lname: "Enter your lastname", 
        username: { 
            required: "Enter a username", 
            minlength: jQuery.format("Enter at least {0} characters"), 
            remote: jQuery.format("{0} is already in use") 
        }, 

    }, 



}); 

</script>

My FOrm

 <!--I am trying to show all the error message here --> 

<form id="signupform" autocomplete="off" method="get" action="">

 FName:
 <input id="fname" name="fname" type="text" value="" />
 Lname:
 <input id="lname" name="lname" type="text" value="" />
 username:
 <input id="username" name="username" type="text" value="" />   <br>      

 <input id="signupsubmit" name="signup" type="submit" value="Signup" />          
 </form>            

1 个答案:

答案 0 :(得分:1)

正如我在评论中提到的那样,它在小提琴中工作

确保加载脚本,您可以尝试使用cdn托管版本的jquery和validate.js

jquery cdn

http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

validate.js cdn

http://ajax.aspnetcdn.com/ajax/jQuery.Validate/1.6/jQuery.Validate.js

如果它适用于此,则表示未加载脚本并检查链接

修改

$(":submit").click(function(e){

    if(!$(this).closest("form").valid()){
        e.preventDefault();
        var errText="";
        $(".error").each(function(i,j){
         errText+=$(j).text()+"<br/>";           
        });
        $("#errDiv").html(errText).css({color:'Red'});  

        }

});

http://jsfiddle.net/85DM4/17/

它不是以逗号分隔,但我相信你会得到这个想法