PDA

View Full Version : JQuery PHP Contact Form



boyee007
13 Feb 2010, 03:11 PM
hi all,
im new in this forum.
i know.. this might be easy question for you. im just bit noob in jscript.
ive got this contact form from website tutorial.

here we go:
I want the error message (CSS Default label.error) showing in motion.
if you know what i mean? lets say, when the user enter wrong email address
the message sliding down (animated) not just appear in constant.

i just dont know how to configure the code to make it animated sliding down / fadeOut / fadeIn / toggle??

the picture message sample is below..
my sample website can been seen.
http://www.ypsingosari.com/test/contactsgit.php
http://i45.tinypic.com/2q9bbi9.jpg

code im using
JQuery:

<script src="js/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="js/jquery.validate.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#contact").validate({
messages: {
name: 'Please enter your full name',
email: 'Please enter a valid email address',
message: 'Please enter your message'
}
});

});
</script>

Contact FORM:

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" name="contact" id="contact">
<div>
<?php if(isset($hasError)) { //If errors are found ?>
<p class="ox">Server Error. Please, try again later!</p>
<?php } ?>
<?php if(isset($emailSent) && $emailSent == true) { //If email is sent ?>
<p class="ok"><strong>Email Successfully Sent!</strong><br>
Thank you <strong><?php echo $name;?></strong> for using the contact form and we will be in touch with you shortly.</p>
<?php } ?>
</div>
<label>Name*: </label>
<input type="text" name="name" id="name" class="required" tabindex="1" minlength="2"><br>
<label> Email*: </label>
<input type="text" name="email" id="email" class="required email" tabindex="2"><br>
<label>Telphone: </label>
<input type="text" name="telp" id="telp" tabindex="3"><br>
<label>Enquiry*:</label>
<select name="enquiry" id="enquiry">
<option selected>General</option>
<option>Database Development</option>
<option>Hardware Maintenance</option>
<option>IT Support &amp; Advice</option>
<option>Software Testing</option>
<option>Web Design &amp; Development</option>
<option>Technical Support</option>
</select>
<br>
<label>Message*:</label>
<textarea name="message" id="message" cols="45" rows="5" class="required" tabindex="4" minlength="5"></textarea>
<br>
<label></label>
<input type="submit" name="send" id="send" value="SEND" tabindex="5">
<input type="reset" name="reset" id="reset" value="RESET" tabindex="6">
</form>

THANKS IN ADVANCE