Ajax not displaying validation messages - php

Question

I have got a PHP contact form where I'm trying to implement Ajax to it to make it more user friendly because the contact form is a pop-up form using javascript/jQuery, so everytime the form is submitted it refreshes the page and you have to go back in the form to view the validation message.
Could you check what am I missing here please? I've been on it for sometime now and it still doesn't work. Please let me know if you want me to add the PHP script.
Ajax code:
jQuery(document).ready(function ($) {
$("#ajax-contact-form").submit(function () {
var str = $(this).serialize();
$.ajax({
type: "POST",
url: "demoform.php",
data: str,
success: function (msg) {
if (msg == 'OK') {
result = '<div class="notification_ok">Your message has been sent. Thank you!</div>';
$("#fields").hide();
} else {
result = msg;
}
$("#note").html(result);
}
});
return false;
});
});
HTML FORM
<center>
<p>Please complete the form below <br />to request a <br/> <span id="free_demo">FREE DEMO</span></p>
<div id="note"></div>
<div id="fields">
<form id="ajax-contact-form" enctype="multipart/form-data">
<div><input type="text" placeholder="Name" name="fullname" id="vpbfullname" value="<?php echo strip_tags($_POST["fullname"]); ?>" class="vpb_input_fields"> <?php echo $submission_status1; ?></div>
<div><input type="text" placeholder="E-Mail" name="email" id="email" value="<?php echo strip_tags($_POST["email"]); ?>" class="vpb_input_fields"><?php echo $submission_status2; ?></div>
<div><input type="text" placeholder="Company" name="company" id="company" value="<?php echo strip_tags($_POST["company"]); ?>" class="vpb_input_fields"><?php echo $submission_status3; ?></div>
<div><input type="text" placeholder="Telephone" name="phone" id="telephone" value="<?php echo strip_tags($_POST["phone"]); ?>" class="vpb_input_fields"><?php echo $submission_status4; ?></div>
<div class="vpb_captcha_wrappers"><input type="text" placeholder="Security Code" id="vpb_captcha_code" name="vpb_captcha_code" class="vpb_input_fields"> </div>
<br/><br/><br/>
Refresh Security Code</font>
<br/><br/>
<div class="vpb_captcha_wrapper"><img src="vasplusCaptcha.php?rand=<?php echo rand(); ?>" id='captchaimg' ></div><br clear="all"><br/>
<br clear="all">
<div><?php echo $submission_status; ?></div><!-- Display success or error messages -->
<div> </div>
<input type="hidden" id="submitted" name="submitted" value="1">
<input type="submit" class="vpb_general_button" value="Submit"></form> </div>
<br clear="all">
</center>
Any help would be great.. Thanks

Answer 1

Use preventDefault();
$("#ajax-contact-form").submit(function (e) {
e.preventDefault();
//....
};
This is preventing the form submit, but ajax call will happens.

Answer 2

you have to write onsubmit="return false" in your form tag like