MEER Posted May 24, 2011 Share Posted May 24, 2011 hello every one, i have my form validated using jQuery and submited using ajax but the ajax part does work could you help. here is my code // JavaScript Document $(document).ready(function(){ // Place ID's of all required fields here. required=["name", "adres","huisnr","postcod", "phone","email"]; name=$("#name"); huisnr=$("#huisnr"); email=$("#email"); phone=$("#phone"); postcod=$("#postcod"); errornotice=$("#error"); // The text to show up within a field when it is incorrect emptyerror="wrong"; emailerror = "Invalid e-mail."; postcoderror="Invalid postcode."; phonerror = "Invalid phone number."; $(".submit").click(function(){ //Validate required fields for(i=0;i<required.length;i++){ var input=$('#'+required); if(input.val() == "" || input.val() == emptyerror){ input.addClass("textfield error"); input.val(emptyerror); errornotice.fadeIn(750); }else{ input.removeClass("textfield error"); } } //Validate the Postcode.first letter should not be 0, space then the two alphabit big letters from A-Z if(! postcod.val().match(/^([1-9]\d{3}\s[A-Z]{2})$/)){ postcod.addClass("textfield error"); postcod.val(postcoderror); } //Validate the phone if(!phone.val().match(/^[0-9]{3}-|\s[0-9]{3}-|\s[0-9]{5}$/)) { phone.addClass("textfield error"); phone.val(phonerror); } // Validate the e-mail. if (!/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(email.val())) { email.addClass("textfield error"); email.val(emailerror); } //if any inputs on the page have the class 'textfield error' the form will not submit if($(":input").hasClass("textfield error")){ return false; }else{ errornotice.hide(); return true; } var dataString= 'name=' + name + '&huisnr=' + huisnr + ''&email=' + email + '&phone=' + phone + '&postcod=' + postcod ; alert (dataString); $.ajax({ type: "POST", url: "mail.php", data: dataString, success: function() { $('#contact_form').html("<div id='message'></div>"); $('#message').html("<h2>Contact Form Submitted!</h2>") .append("<p>We have received your order.</p>") .hide() .fadeIn(1500, function() { $('#message').append("<img id='checkmark' src='images/check.png' />"); }); } }); //cancel the submit button default behaviours return false; }); // Clears any fields in the form when the user clicks on them $(":input").focus(function(){ if($(this).hasClass("textfield error")){ $(this).val(""); $(this).removeClass("textfield error"); } }); }); Link to comment https://forums.phpfreaks.com/topic/237313-ajax-form-submit-does-not-work/ Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.