I am using jquery validation plugin for form validation. But I have to validate image height width also. I searched on google. But I didn't get.
I want height: 150px and width: 300px in logo to validate. If image height and width is equalto my given dimensions. Then form will be post.
My image form is:
<div class="col-md-6 mb-50">
<span class="input">
<label class="" for="cf-website" style="font-weight: 500;">Upload Logo </label>
<input class="input__field cf-validate check-image-size" type="file" id="logo" name="logo" accept="image/png,image/jpeg" />
</div>
MY js is: I am validating complete form. Please ignore other fields.
<script type="text/javascript">
$('form[id="submit_form"]').validate({
rules: {
username: {
maxlength: 40,
},
business_title: {
maxlength: 40,
},
designation_qualification: {
maxlength: 60,
},
business_speciality: {
maxlength: 50,
},
contact: {
maxlength: 16,
number: true,
},
email: {
email: true,
},
website: {
maxlength: 100,
},
addres: {
maxlength: 100,
},
description: {
maxlength: 115,
}
},
messages: {
username: {
maxlength: 'Maximum 40 characters allowed'
},
business_title: {
maxlength: 'Maximum 40 characters allowed'
},
designation_qualification: {
maxlength: 'Maximum 60 characters allowed'
},
business_speciality: {
maxlength: 'Maximum 50 characters allowed'
},
contact: {
maxlength: 'Maximum 16 characters allowed',
number: 'Please enter number only'
},
email: {
email: 'Enter a valid email'
},
website: {
maxlength: 'Maximum 100 characters allowed'
},
addres: {
maxlength: 'Maximum 100 characters allowed'
},
description: {
maxlength: 'Maximum 115 characters allowed'
}
},
submitHandler: function(form) {
form.submit();
}
});
</script>