2016-05-12 5 views
0

私はjquery fomバリデーションプラグインを使用しています。私の懸念は、登録時に強制的にimgaeをアップロードするのではなく、ユーザーが画像をアップロードした場合、画像がpng,jpeg,jpgタイプであることです。以下 TypeError:t.validator.methods [a]は未定義ですか?

は、その動作していない私のコードです

 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> 
+0

もここ –

+0

@DharaParmarのhtmlを投稿します:私はhtmlを投稿しました – ashwintastic

+0

フォームiから画像のアップロードフィールドを削除するときtsは正常に動作します。 – ashwintastic

答えて

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(); 
     } 
    }); 
+0

がうまくいきませんでした:( – ashwintastic

+0

まだ同じエラーが発生していません – ashwintastic

+0

上記のコードを更新しました –