javascript - Sending information to a php file from AJAX and getting a response back from php not when I want to -

i have contact page i'm working on , coded if invalid email sent through, php sends response, way coded now, sends message field missing or nothing filled in @ , clicks send. can view @ http://sundayfundayleague.com/contact.php

i still want normal html5 'required' fields take place , if email field not right php else response.. "invalid email, please provide valid email address."; show up.

how can this?

if (filter_var($email, filter_validate_email)) { // line checks have valid email address mail($to, $subject, $message, $headers); //this method sends mail. echo "your email sent!"; // success message }else{ echo "invalid email, please provide valid email address."; } 

ajax call

<script>             $(document).ready(function(){                  $('#submit').click(function(){                      $.post("contactsend.php", $("#mycontactform").serialize(),  function(response) {                         if (response == 'your email sent!') {                             $('#contactmessagestatus').append(response);                             $('#contactmessagestatus').addclass("contactsuccess");                             $('html, body').animate({                                 scrolltop: $("#contactmessagestatus").offset().top                              }, 2000);                             $('#contactmessagestatus').html(response);                             $('#contactmessagestatus').delay(5500).fadeout(400);                         }                         else {                             $('#contactmessagestatus').append(response);                             $('#contactmessagestatus').addclass("contactfail");                             $('html, body').animate({                                 scrolltop: $("#contactmessagestatus").offset().top                              }, 2000);                             $('#contactmessagestatus').html(response);                             $('#contactmessagestatus').delay(5500).fadeout(400);                         }                     });                     return false;                 });             });         </script> 

form

<form action="" method="post" id="mycontactform" >                 <input type="text" class="inputbar" name="name" placeholder="full name" required>                 <input type="email" class="inputbaremail" name="email" placeholder="email" required>                 <!--                 <input type="message" class="inputbarmessage" name="message" placeholder="message" required>                 -->                 <textarea rows="4" cols="50" name="message" class="inputbarmessage" placeholder="message" required></textarea>                 <label for="contactbutton">                     <input type="button" class="contactbutton" value="send message" id="submit">                 </label>             </form> 

you'll need check if email address has been filled out first. should it.

if (!empty($email)) {      if (filter_var($email, filter_validate_email)) {           //should check on mail function         if (mail($to, $subject, $message, $headers)) {             echo "your email sent!"; // success message         } else {             echo "mail not sent!"; // failed message         }      } else {          //invalid email         echo "invalid email, please provide valid email address.";     }  } else {     //$email not filled out }