我正在使用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>
答案 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();
}
});