TypeError:t.validator.methods [a]未定义?

时间:2016-05-12 06:45:05

标签: jquery validation

我正在使用jquery fom验证插件,我担心的是,imgae在注册时不是必须上传的,但如果用户上传了图片,那么图片应该是png,jpeg,jpg类型。

下面是我的代码无法正常工作

        setupFormValidation: function()
    {    //form validation rules
        $(".new_user").validate({
            rules: {
                "user[firstname]": "required",
                "user[lastname]": "required",
                "user[email]": {
                    required: true,
                    email: true
                },
                "user[password]": {
                    required: true,
                    minlength: 8
                },
                agree: "required",
               "user[password_confirmation]": {
                    required: true,
                    minlength:8,
                    equalTo: "#user_password"
                 },
                 "user[avatar]": {
                    required: false,
                    accept:"jpg,png,jpeg,gif"
                 }
            },
            messages: {
                "user[firstname]": "Please enter your firstname",
                "user[lastname]": "Please enter your lastname",
                "user[password]": {
                    required: "Please enter a password",
                    minlength: "Your password must be at least 8 characters long"
                },
                "user[password_confirmation]": {
                    required: "Please enter a confirm password",
                    minlength: "Your password must be at least 8 characters long",
                    equalTo: "Confirm Password doesn't match with Pasword"
                },
                "user[email]": {
                   required: "Please enter your email id"
                 },
                "user[avatar]": {
                  accept: "Only jpeg, jpg are allowed..."
                },
            },
            submitHandler: function(form) {
                form.submit();
            }
        });
    }

html:

   <form method="post" accept-charset="UTF-8" action="/users"enctype="multipart/form-data" id="new_user" class="new_user" novalidate="novalidate">

    <div class="required field">
      <label> Name </label>
    <input type="text" id="user_firstname" name="user[firstname]"    placeholder="Firstname" autofocus="autofocus">
    <input type="text" id="user_lastname" name="user[lastname]" placeholder="Lastname">
    </div>

    <div class="required field">
    <label for="user_email">Email</label>
    <input type="email" id="user_email" name="user[email]" value="">
    </div>

    <div class="required field">
    <label for="user_password">Password</label>
    <input type="password" id="user_password" name="user[password]" autocomplete="off">
    <em>(8  characters minimum)</em>
    </div>


    <div class="required field ">
    <label> Confirm Password </label>
    <input type="password" id="user_password_confirmation" name="user[password_confirmation]" autocomplete="off">
      </div>


      <div class="field">
    <label>  Choose a profile image </label>
    <input type="file" id="user_avatar" name="user[avatar]" accept="image/*" as="file">
      </div>

      <div class="actions">
      <input type="submit" id="commit" value="Sign up" name="commit">
      </div>
<br>
</form>

1 个答案:

答案 0 :(得分:1)

删除接受并添加扩展程序并尝试此操作:

    $("#new_user").validate({
        rules: {
            "user[firstname]": "required",
            "user[lastname]": "required",
            "user[email]": {
                required: true,
                email: true
            },
            "user[password]": {
                required: true,
                minlength: 8
            },
            agree: "required",
           "user[password_confirmation]": {
                required: true,
                minlength:8,
                equalTo: "#user_password"
             },
             "user[avatar]": {
                    required: false,
                    extension: "png|jpg|gif|jpeg"
                }
        },
        messages: {
            "user[firstname]": "Please enter your firstname",
            "user[lastname]": "Please enter your lastname",
            "user[password]": {
                required: "Please enter a password",
                minlength: "Your password must be at least 8 characters long"
            },
            "user[password_confirmation]": {
                required: "Please enter a confirm password",
                minlength: "Your password must be at least 8 characters long",
                equalTo: "Confirm Password doesn't match with Pasword"
            },
            "user[email]": {
               required: "Please enter your email id"
             },
            "user[avatar]": "Only jpeg, jpg are allowed...",

        },
        submitHandler: function(form) {
            form.submit();
        }
    });