A Pretty Ajax Contact Form With jQuery & PHP
27
Sep
Tutorialzine is sharing a nice tutorial with source on creating a fancy Ajaxed contact form that is built with jQuery & PHP.
The form is unobtrusive & has a server-side validation which makes it degrade gracefully when the JavaScript is turned off.
It takes advantage of 2 jQuery plugins:
- formValidator – for validation
- JQTransform – for stying input fields
and a PHP class:
- PHPMailer – for sending the e-mails
The contact form also has a basic captcha which works by asking the sum of 2 random numbers.
To check a demo of the form, click here.
Requirements: PHP
Compatibility: All Major Browsers
Website: http://tutorialzine.com/2009/09/fancy-contact-form/
Demo: http://demo.tutorialzine.com/2009/09/fancy-contact-f...
Compatibility: All Major Browsers
Website: http://tutorialzine.com/2009/09/fancy-contact-form/
Demo: http://demo.tutorialzine.com/2009/09/fancy-contact-f...
- Tags:
Captcha Javascript Php
- Filed under: Forms, Goodies, License Free
- 21 Comments
21 Responses for "A Pretty Ajax Contact Form With jQuery & PHP"
Too bad that the number verification isnt working correctly in the demo form. makes it loosing trust before even downloaiding it.
Yeah like dirk digizaal webdevelopment said,it’s not working but i downloaded it and fixed it.
Wow Thanks for sharing such a nice form!
Great job! Thanks for sharing your knowledge!
Hey Vince,
Would you mind please explaining how you fixed the captcha??
Thanks!
I’ve searched the internet pretty extensively and this is simply…the best ajax contact form out there. Cannot thank you enough. Best regards and elite coding. USE THIS GUYS.
Nice,, but…there’s no captcha there….
in FF3.6, when you click to type, the type tool is off from the text box, idk how to explain this. but the little thing that blinks to show you where you’re going to type is slightly more down than where it should be. idk how to fix that. but works great in IE and such
I really like this form, but I’ve experienced a lot of quirky behavior using it. Sometimes it works, sometimes it does not. Also seems to be a bug when using under Google Chrome and always fails with the “wrong verification number” error.
Very nice.
Thank you for sharing this, I love it, very easy to use and configure.
Great stuff , thanks a lot !!
awaseome stuff 5 stars here.
How do I get rid of the “subject” selection?
I don’t need it but if I try to cut it from php or js it doesn’t work anymore, there is no class validate[required,custom[email]] in that case.
cheers!
it looks diffrent in IE 7.0 then FF 3.6, it would be great to see this form looks exactly the same in every modern browser and made with div’s, not tables.
Parse error: syntax error, unexpected T_STRING, expecting T_OLD_FUNCTION or T_FUNCTION or T_VAR or ‘}’ in /home/jungle/public_html/novocopa/phpmailer/class.phpmailer.php on line 53
?!?!?!?!
name must be greater than or equal to three character or you will get the wrong message at number verification
Hi i would like to know if how add a file uploader to the form.
@Luke,
You can take a look at http://valums.com/ajax-upload/ or any other jQuery upload solutions.
But I can see that it’ll require some effort.
I’ve experienced a lot of quirky behavior using it. Sometimes it works, sometimes it does not. Also seems to be a bug when using under Google Chrome and always fails with the “wrong verification number” error.
How do you fix the “Wrong verification number!” I get it everytime!
How do you get the $_POST for multiple checkboxes?
I am getting an empty array:
<input type="checkbox" name="checkbox[]" value="” /> Checkbox
OR
Checkbox
$_POST[checkbox];
??
Thanks,
Mark
You will define the field
You may get the value as with loop ::
for($j=0; $j < count($_POST['intrested_categories']); $j++)
{
$intrested_cat = $_POST['intrested_categories'];
if($intrested_cate == '')
$intrested_cate = $intrested_cat[$j];
else
$intrested_cate = $intrested_cate."-".$intrested_cat[$j];
}
// OUTPUT will be the value of check box in string
I prepare for job with http://quizplaza.com
It is good