Contact form

Contact form

Hi,

I'm new to developing with jquery and i'm trying to make a contact form with a dropdown select option.
For now as response I get 'undefined' back form the contact form.
Can somebody help me out?

Here's my code:

HTML:

 <form id="contactForm">
                <fieldset>
                    <label for="contactName" id="name_label">Naam</label>
                    <input type="text" name="contactName" id="contactName" size="30" value="" class="text-input" />
                    <span class="error" id="nameError">Vul uw naam in!</span>
                    
                    <label for="contactEmail" id="email_label">Email</label>
                    <input type="text" name="contactEmail" id="contactEmail" size="30" value="" class="text-input" />
                    <span class="error" id="emailError">Vul uw email adres in!</span>
                    <span class="error" id="emailError2">Vul een geldig email adres in!</span>
                    
                    <label for="contactKeuzen" id="keuzen_label">Springkussen :</label>
                    <select name="keuze" >
                        <option value="opt1">Maak uw keuzen</option>
                        <option value="opt2">Jungle 125,- per dag</option>
                        <option value="opt3">Luchtkasteel 90,- per dag</option>
                        <option value="opt4">Clown 90,- per dag</option>
                        <option value="opt5">Lucht fort 155,- per dag</option>
                        <option value="opt6">Paddestoel 125,- per dag</option>
                        <option value="opt7">Giraaf 75,- per dag</option>
                    </select>
            
                    <label for="contactMessage" id="message_label">Bericht</label>
                    <textarea  name="contactMessage" id="contactMessage" class="text-input"></textarea>
                    <span class="error" id="messageError">Vul een bericht in!</span>
                    <p>
                        <input type="submit" name="submitMessage" class="contactButton button grey" id="contactSubmitBtn" value="Send"/>
                    </p>
                </fieldset>
            </form>




























Contact.js

     
 jQuery(function() {
  jQuery('.error').hide();
    jQuery(".contactButton").click(function() {
    jQuery('.error').hide();
        
      var name = jQuery("input#contactName").val();
        if (name == "" || name == "Your Name") {
      jQuery("span#nameError").show();
      jQuery("input#contactName").focus();
      return false;
    }
      var email = jQuery("input#contactEmail").val();
      if (email == "" || email == "Your Email Address") {
      jQuery("span#emailError").show();
      jQuery("input#contactEmail").focus();
      return false;
    }
    
      var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
      if(!emailReg.test(email)) {
      jQuery("span#emailError2").show();
      jQuery("input#contactEmail").focus();
      return false;
    }
     var keuze = jQuery("input#contactKeuzen").val();
      if (keuze == "" || keuze == "-") {
      jQuery("span#modelErrorr").show();
      jQuery("input#contactKeuzen").focus();
      return false;
    }
    
      var msg = jQuery("textarea#contactMessage").val();
      if (msg == "" || msg =="Your Message Here") {
      jQuery("span#messageError").show();
      jQuery("textarea#contactMessage").focus();
      return false;
    }
      var dataString = 'name='+ name + '&email=' + email + '&keuze=' + keuze + '&msg=' + msg;
      jQuery.ajax({
      type: "POST",
      url: "js/mail.php",
      data: dataString,
      success: function() {
        jQuery('#contactForm').html("<div id='contactForm' style='display:none;'></div>");
        jQuery('#contactForm').html("<div id='successMessage'></div>");
        jQuery('#successMessage').html("<strong style='color:#5b5b5b; float:left; margin-top:10px;'>Bericht is verzonden!</strong><br/><br/>")
        .append("<p style='float:left; padding-bottom:30px;'>Bedankt voor het invullen van het contactformulier. We zullen zo spoedig mogelijk contact met u opnemen.</p>")
        .hide()
        .fadeIn(1500, function() {
          jQuery('#successMessage');
          location.reload();
        });
      }
     });
    return false;
    });
});























































Mail.js
     
<?php
   
if ((isset($_POST['name'])) && (strlen(trim($_POST['name'])) > 0)) {
    $name = stripslashes(strip_tags($_POST['name']));
} else {$name = 'No name entered';}
if ((isset($_POST['keuze'])) && (strlen(trim($_POST['keuze'])) > 0)) {
    $keuze = stripslashes(strip_tags($_POST['keuze']));
} else {$keuze = 'No choice selected';}
if ((isset($_POST['email'])) && (strlen(trim($_POST['email'])) > 0)) {
    $email = stripslashes(strip_tags($_POST['email']));
} else {$email = 'No email entered';}
if ((isset($_POST['msg'])) && (strlen(trim($_POST['msg'])) > 0)) {
    $message = stripslashes(strip_tags($_POST['msg']));
} else {$message = 'No message entered';}
ob_start();

    $headers = 'From: ' . $email . "\r\n" .
                'Reply-To: ' . $email . "\r\n" .
               'X-Mailer: PHP/' . phpversion();
  
    $myEmail = 'chrisvkesteren@gmail.com';
    $todayis = date("l, F j, Y, g:i a") ;
    $subject = "Message From Site";   
    $message = " Naam: $name  \r \n Keuzen: $keuze  \r \n Afzender: $email \r \n Bericht: $message";
   
    mail($myEmail, $subject, $message, $headers);
?>
 



























 

Thanks in advance!