@CrocoDillon Website Contact Form

[CodeGraphics]

Yes, I checked out his website. I deliberated filled the contact form because I knew the data will not submit traditionally by having the browser loading to send the form and then echo a thank you message. I was expecting something ajaxing. And wow, I was right. The form freezed in a gray color, then slided right with a thank you bar replacing the submit button. Then under few seconds, the form slided back again in it’s former position.

Before filling the form, I tried submitting it without filling the fields to see it’s reaction. And it reacted by shaking itself in a no-way-I-can’t-be-sent-like-that attitude.

http://crocodillon.com/contact

Please can someone explain to me the js and ajax behind those behaviours probably with a codepen sample.

[pixelgrid]

The code for that contact form its posted on his codepen account

http://codepen.io/CrocoDillon/pen/GJclb

you can have a look there

[CodeGraphics]

Here is my question. where does the form data sent to?

[CrocoDillon]

In response to what you submitted: Hi back :P

Yeah @pixelgrid is right, I created the Pen first to play around with the idea and then used almost the exact same JS live. Just view the source of that page, I kept everything inside the html because it’s not much code and only used on one page.

[CrocoDillon]

> Here is my question. where does the form data sent to?

The same page, I have to find a better solution for that (something that returns JSON with success or failure messages). Now it just waits for any response and assumes success. I will fix that but it’s not something that has high priority for me.

[CodeGraphics]

@Crocodillon, thank u. I want to use the form in a website am working on right now. I have added the form and it’s behaving normally. But i want the data to be sent to a gmail account. How can i achieve that?

[CrocoDillon]

I’d open a new thread for that. I have to go soon and can’t go into details. I’m using `ZendMail` (comes with Zend Framework 2 but can be used alone) and it’s as simple as:

$mail = new Message(); // ZendMailMessage
$mail->setEncoding(‘utf-8’);
$mail->setFrom(‘[email protected]’);
$mail->setTo(‘[email protected]’);
$mail->setReplyTo($data);
$mail->setSubject(‘Contact Form’);
$mail->setBody(
“Name:nn{$data}nn” .
“Email:nn{$data}nn” .
“Message:nn{$data}”
);
try {
$transport = new Sendmail(); // ZendMailTransportSendmail
$transport->send($mail);
} catch (Exception $e) {}

where $data is validated and sanitized.

[CodeGraphics]

Ok. should i put these codes in between php tag and save it separately, then put the file name in my form action?

Here is the form:

Name

Email

Message

[pixelgrid]

if you will validate and send the emain from the same file change your file extension from .html to .php and make your validation at the top of the file inside tags.

If you want the data to be validated in another file insert the file in the action attribute like action=’validate.php’;

and create a new file from where you will validate and send your email.

[Author]

Posts