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"); } }); }); Quote Link to comment https://forums.phpfreaks.com/topic/237313-ajax-form-submit-does-not-work/ Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.