You should remove the
<meta http-equiv=\"refresh\" content=\"0;URL=contactus.php\">
from your document head
section, first.
The problem
Each time you press submit button on your form, you call chkContact
where you do an ajax call. You should put an if
before the ajax, so that it would not get executed if the form is invalid.
if( form is valid ){
$.ajax( ... );
}else{
prompt the user that form is invalid and should be filled again
}
Update
<form name="contactForm" method="post" id="contactForm" onsubmit="return chkContact(this)">
<div class="input1">
<div class="help">
<input id="name" name="name" type="text" placeholder="Name " value="<?php echo $user_profile["name"]; ?>">
</div>
<div id="email-label" class="help">
<input id="email" name="email" type="text" placeholder="Email Address " class="input-xlarge" value="<?php echo $user_profile["name"]; ?>">
</div>
<div id="subj-label" class="help">
<input id="subject" name="subject" type="text" placeholder="Subject " class="input-xlarge" value="<?php echo $user_profile["subject"]; ?>">
</div>
<div id="message" class="help">
<textarea id="message" name="message" rows="13" cols="33" placeholder="Message " class="input-xlarge"></textarea>
</div>
<button id="btnSubmit" type="submit" value="Send" onclick="return chkContact()">Send</button>
<div id="msgSubmit" class="h3 text-center hidden"></div>
</div>
</form>
<script>
function chkContact(form){
if(form.name.value == "" && form.email.value == "" && form.subject.value == "" && form.message.value == "" ){
alert("Please fill in the required fields: \n\u26AC Name \n\u26AC Email \n\u26AC Subject \n\u26AC Message");
form.name.focus();
return false;
}
if(form.name.value == ""){
alert("Error: Name cannot be blank!");
form.name.focus();
return false;
}
if(form.email.value == ""){
alert("Error: Email Address cannot be blank!");
form.email.focus();
return false;
}
re = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
if(!re.test(form.email.value)){
alert("Error: Invalid email address!");
form.email.focus();
return false;
}
if(form.subject.value == ""){
alert("Error: Subject cannot be blank!");
form.subject.focus();
return false;
}
if(form.message.value == ""){
alert("Error: Message cannot be blank!");
form.message.focus();
return false;
}
var name = document.getElementById('name').value;
var email = document.getElementById('email').value;
var subject = document.getElementById('subject').value;
var message = document.getElementById('message').value;
var dataString='name="+ name+"&email="+email+"&subject="+subject+"&message="+message;
$.ajax({
type:"post",
url: "<?php echo $base_url; ?>ajax-helper/post-email.php",
data:dataString,
cache:false,
success: function(data){
if (/^\s*SUCCESS\s*$/.test(data)) {
window.location = "<?php echo $base_url; ?>index?success=true';
}else{
alert(data);
}
}
});
return false;
}
</script>