0

Hey guys,

I have a bit of a problem with implementing an ajax based contact form. I am sure I forgot something...does this almost look right? What do you think the problem is, the form still submits but the page refreshes instead of just sliding the form up and fading in my success message. Any help would be greatly appreciated.

$(document).ready(function() {

	//Define URL to PHP mail file
	var url = "contact.php";
	
	//Activate jQuery form validation
	$("#contact").validate({
	
		submitHandler: function() {
		
			//Define data string
			var datastring = $("#contact").serialize();
			
			//Submit form
			$.ajax({
				type: "POST",
				url: url,
				data: datastring,
				success: function(){
					$('#contact').slideUp();
					$('#process_message').fadeIn();
				}
			});
		}
	
	});
			
});
2
Contributors
2
Replies
4
Views
7 Years
Discussion Span
Last Post by drewpark88
0

No, I made sure to keep that blank: action=""

The HTML is below:

<form name="contact" method="post" action="" id="contact">

<fieldset>

<label>Your Name:</label>

   <input type="text" id="fullname" class="text_field" name="fullname" size="19">

<label>Your Email:</label>

   <input type="text" id="email" class="text_field" name="email" size="19">

<label>Your Message:</label>

   <textarea rows="9" id="inquiry" class="text_area" name="inquiry" cols="30"></textarea>

   <input type="submit" class="submit_btn" value="submit" name="submit">

</fieldset>

</form>

                        <div id="process_message">
                            <h3>Thank you for your inquiry!</h3>
                        </div>

Does your form tag perhaps contain action="contact.php" ?

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.