$(document).ready(function(){

	$("input#anders").hide();
	$('.error').hide();
	$("#voornaam_error").show();
	
	$('.button').click(function(){
	
	$('.error').hide();
	
	var voornaam = $("input#voornaam").val();
	var achternaam = $("input#achternaam").val();
	var email = $("input#email").val();
	var telefoon = $("input#phone").val();
	var bericht = $("textarea#bericht").val();
	
	var aanhef = document.getElementById("aanhef")
	var aanhefIndex = aanhef.selectedIndex;
	var aanhefVal = aanhef.options[aanhefIndex].value;
	
    var onderwerp = document.getElementById("onderwerp");
	var onderwerpIndex = onderwerp.selectedIndex;
  	var onderwerpVal = onderwerp.options[onderwerpIndex].value;
  	
  	//validation
  	if (aanhefVal == "null") {
  	$("#aanhef_error").show();
	$("#aanhef").focus();
  	$("label#aanhef_error").text("Vul a.u.b. een aanhef in");
  	return false;
  	}	
  	if (voornaam == "" || voornaam.length < 2){
  	$("#voornaam_error").show();
    $("label#voornaam_error").text("Vul a.u.b. uw voornaam in");
    $("#voornaam").focus();
    return false;	
  	}
  	if (achternaam == "" || achternaam.length <2){
  	$("#achternaam_error").show();
 	$("label#achternaam_error").text("Vul a.u.b. uw achternaam in");
  	$("#achternaam").focus();
  	return false;
  	}
  	//email validation
  	var EmailError = false;
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
 
    if(email == '') {
    $("#email_error").show();
    $("#email_error").text("Vul a.u.b. uw e-mailadres in.");
    $("#email").focus();    
    EmailError = true;
    }
    else if(!emailReg.test(email)) {
    $("#email_error").show();
    $("#email_error").text("Vul a.u.b. een geldig e-mailadres in.");
    $("#email").focus();    
    EmailError = true;
    }
 	if(EmailError == true) { return false; }
 	
  	//phone validation
  	var PhoneError = false;
  	var numericReg = /^\d*[0-9](|.\d*[0-9]|,\d*[0-9])?$/;
    if(!numericReg.test(telefoon)) {
    $("#phone_error").show();
    $("#phone_error").text('Vul a.u.b. een geldig telefoonnummer in.')
    $("#phone").focus();
    PhoneError = true;    
    }
    else if(telefoon == ""){
    $("#phone_error").show();
    $("#phone_error").text('Vul a.u.b. uw telefoonnummer in.')
    $("#phone").focus();
    PhoneError = true;
    }
    else if(telefoon.length < 10 || telefoon.length > 11){
    $("#phone_error").show();
    $("#phone_error").text('Vul a.u.b. een geldig telefoonnummer in.')
    $("#phone").focus();
    PhoneError = true;
    }
    if(PhoneError == true){ return false }
  	
  	//extra input and validation onderwerp
  
  	var aa = false;
  	if(onderwerpVal == "anders"){
  	onderwerpVal = $("input#anders").val();
  	aa = true;
  	}
  	else{
  	aa = false;
  	}
  	if(aa == true){
    if(onderwerpVal == ""){
  	$("#onderwerp_error").show();
  	$("#onderwerp_error").text('Vul a.u.b. een onderwerp in.');
	$("#anders").focus();  	  	
	return false
  		}
  	}
  	if(onderwerpVal == "null"){
  	$("#onderwerp_error").show();
  	$("#onderwerp_error").text('Vul a.u.b. een onderwerp in.');
  	$("#onderwerp").focus();  	  	
	return false
  	}
  	if(bericht == ""){
  	$("#bericht_error").show();
  	$("#bericht_error").text("Vul a.u.b. een bericht in");
  	$("#bericht").focus();
  	return false;
  	}
  	
	
	//var onderwerp = $("onderwerp").selectedValues();
	
	  
var dataString = 'aanhef=' + aanhefVal + '&voornaam=' + voornaam + '&achternaam=' + achternaam + '&email=' + email + '&telefoon=' + telefoon + '&onderwerp=' + onderwerpVal + '&bericht=' + bericht;
	
	$.ajax({
	type: "POST",
	url: "_assets/php/form.php",
	data: dataString,
	 success: function() {
	 $("#contactForm").html("<div id='message'></div>");
	 $("#message").html("<h2>Bedankt voor uw bericht!</h2><br>")
	 .append("<p>Wij nemen zo snel mogelijk contact met u op.</p>")
	 .append("<p>Wilt u nog een bericht sturen?</p>")
	 .append("<p>Klik dan <a href='http://kemperink-bv.nl/#contact'>hier</a></p>")
	 .hide()
	 .fadeIn(1000, function(){});
	}//.succes ajax end
	
});//.ajax end
  return false;  
});//button.click end
	
	
});//document.ready end

function changeHandler(){
  var dropdown = document.getElementById("onderwerp");
  var index = dropdown.selectedIndex;
  var ddVal = dropdown.options[index].value;
  var ddText = dropdown.options[index].text;
  
  if (ddVal == "anders"){
  $('input#anders').show();
  }
  else{
  $("input#anders").hide();
  }
};