We Keep Coding

I need to validate the form, the ajax should only work if the form validates

I'm trying to validate the form. Its validating perfectly but the form is not submitting. In the console it says isValid() is not a function
I tried to give a condition that form validates
$('#saveStudent').parsley();
var addvalidation = new JustValidate('#saveStudent');
addvalidation.addField('#poster', [{
rule: 'files',
value: {
files: {
extensions: ['jpeg', 'png', 'jpg'],
// maxSize: 25000,
// minSize: 1000,
types: ['image/jpeg', 'image/png', 'image/jpg'],
// names: ['file1.jpeg', 'file2.png'],
},
},
errorMessage: 'Only jpeg, jpg, png formats are supported.',
}, ]);
$(document).on('submit', '#saveStudent', function (e) {
e.preventDefault();
var formData = new FormData(this);
formData.append("save_student", true);
if ($(this).parsley().isValid() && addvalidation.isValid()) {
$.ajax({
type: "POST",
url: "save.php",
data: formData,
processData: false,
contentType: false,
success: function (response) {
$('#addMovie').show();
$('#studentAddModal').modal('hide');
$('#saveStudent')[0].`your text`reset();
$('#myTable').load(location.href + " #myTable");
}
});
}
});

how to validate a same form in different button click using jquery

edit-txt,updatePassword are two buttons in a single form superAdminDetailsForm . i want to valide this form in both button click. I wrote form validation on each button click .but it doesn't work. edit-txt button is type of text and update password is type of button
$().ready(function() {$('#edit-txt').on('click', function() {
$("#superAdminDetailsForm").validate({
rules: {
superadminEmail:{
required:true,
email:true
},
},
messages: {
superadminEmail:"Please enter your Email id"
},
submitHandler: function(){
var formData =$("#superAdminDetailsForm").serialize();
$.ajax({
url:'/accounts',
type:'post',
datatype: 'json',
data: formData,
success : function(response){
if(response == "true"){
window.location='/accounts';
} else {
alert("false")
}
},
error: function (request,status, error) {
}
});
return false;
}
});
});
$('#updatePassword').on('click', function() {$("#superAdminDetailsForm").validate({
rules: {
oldPassword:"required",
newPassword:"required",
confirmpassword:{
require :"true",
equalTo : "#oldPassword"
}
},
messages: {
oldPassword:"Please enter Old Password ",
newPassword: "Please enter New Password",
confirmpassword:"Retype password is incorrect"
},
submitHandler: function(){//to pass all data of a form serial
var formData =$("#superAdminDetailsForm").serialize();
$.ajax({
url:'/changePassword',
type:'post',
datatype: 'json',
data: formData,
success : function(response){
if(response == "true"){
window.location = '/accounts';
} else {
alert("password incorrect");
}
},
error: function (request,status, error) {
}
});
return false;
}
});
});
});

How to Add ajax form processing for html mail form

I currently finished creating ( modify a themeforest template ) a website and all i need to do now is to set up contact form to receive mail from my customers
/* *****************************************************************
* FORM VALIDATION
* ************************************************************** */
$("#contactForm").validate({
rules: {
fullname: {
required: true
},
email: {
required: true,
email: true
},
message: {
required: true
}
},
messages: {
fullname: {
required: "Please enter your name"
},
email: "Please enter a valid email address",
message: "Please enter your message"
},
submitHandler: function () {
// Add your ajax form processing here.
}
});
This is the code form config.js file. How do i set up with my mail ( contact#website.com )

$.ajax({type:'POST', url: 'contact.php', data:$('#contactForm').serialize(), success: function(response) { $('#contactForm').find('.form-control').html(response);}});
this is the final syntax that works perfectly

try this
var data = new FormData($("#contactForm")[0]);
$.ajax({
url : 'your url ',
type : 'post',
data : data,
mimeType : 'multipart/form-data'
contentType: false,
processData: false,
success: function(data){
}
});

How can I validate if email exists

I am using the jQuery validation plugin and it works correctly , but I have a problem checking email. I receive true or false dependant on if email exists or not. However I don't know how to change the state of validation in the form, because I can't pass the validation.
email: {
required: true,
email: true,
remote: {
url: "checkEmail",
type: "get",
success: function(data){
if (data.msg == true) {
///Email avaliable////
console.log("OK");
} else {
/////Email taken///
console.log("NO");
}
}
},
},
Could anyone help me?

Considering that the ajax call returns true or false based on data , you can try the following code snippet of email rule and messages rule .
email: {
required: true,
email: true,
remote: {
url: "checkEmail",
type: "post",
data: {
email: function() {
return $('#formID :input[name="email"]').val();
}
}
}
},
messages: {
email: {
required: "Please enter your email address.",
email: "Please enter a valid email address.",
remote: jQuery.validator.format("{0} is already taken.")
}
}

jquery validation and ajax form submit

I have problem with jquery validation and ajax form submit.
Here's validation code:
$(function() {
$("#contact-form").validate({
rules: {
name: {
required: true,
minlength: 2,
maxlength: 32
},
email: {
required: true,
email: true
},
message: {
required: true,
minlength: 20
}
},
messages: {
name: {
required: "Please, enter a name",
minlength: $.format("Keep typing, at least {0} characters required"),
maxlength: $.format("Whoa! Maximum {0} characters allowed")
},
email: {
required: "Please, enter an email",
email: $.format("Please, enter valid email")
},
message: {
required: "Please, enter a message",
minlength: $.format("Keep typing, at least {0} characters required")
}
},
submitHandler:function(form) {
form.submit();
}
});
});
Here's ajax code for submitting the form:
$(document).ready(function(){
$('#contact-form').on('submit',function(e) {
$('#name').val('Your Name');
$('#email').val('Your Email');
$('#message').val('Your Message');
$.ajax({
url:'',
data:$(this).serialize(),
type:'POST',
success:function(data){
console.log(data);
$("#success").show().fadeOut(10000);
},
error:function(data){
$("#error").show().fadeOut(10000);
}
});
e.preventDefault();
});
});
What I try to do is form validation and then submit the form. After submit the form should appear again with initial values.
The problem is that when I remove ajax then validation works fine, but I need ajax code to re-display the form.
How I could make this two pieces of code work together?

Place your ajax call within the submitHandler function:
submitHandler:function(form) {
//form.submit();
$.ajax({
url:'', //you will need a url surely, perhaps $(form).attr('action');
data:$(form).serialize(),
type:'POST',
success:function(data){
console.log(data);
$('#name').val('Your Name');
$('#email').val('Your Email');
$('#message').val('Your Message');
$("#success").show().fadeOut(10000);
},
error:function(data){
$("#error").show().fadeOut(10000);
}
});
}