HTML/PHP Contact Form Tutorial with Validation and Email Submit

Подписаться 102 тыс.

Просмотров 519 тыс.

50% 1

Upgrade your Clever Techie learning experience:
/ clevertechie
UPDATE! (9/13/19) New features and improvements for Clever Techie Patreons:
1. Download full source code with detailed comments - easy to learn and understand code
2. Weekly source code file updates by Clever Techie - every time I learn new things about a topic I will add it to the source file and let you know about the update - keep up with the latest coding technologies
3. Library of custom Clever Techie functions with descriptive, easy to understand comments - skyrocket coding productivity, code more efficiently by using Clever library of custom re-usable functions
4. Syntax code summary - memorize and review previously learned code faster
4. Organized file structure - access all Clever Techie lessons, source code, graphics, diagrams and cheat sheet from a single workspace - no more searching around for previously covered material and source code - save enormous amount of time and effort
5. Outline of topics the source file covers - fast review of all previously learned coding lessons
6. Access to all full HD 1080p videos with no ads
7. Console input examples - interactive examples that make it easier to understand and learn coding
8. Access to updated PHP Programming Book by Clever Techie
Download this video's source code and additional files here:
/ html-php-contact-20812527
`````````````````````````````````````````````````````````````````````````````````````````````
This is a fast way to create your own HTML contact form with PHP validation rules and email submit. We use codepen.io which is a great web site for downloading existing code for web developers. We then modify the code to suit our needs and include PHP validation rules. You can use this same process to create just about any HTML form with CSS and PHP validation rules and submit the email using PHP. By knowing how the process of submitting the form and validation works, you'll be able to create your own custom HTML contact, registration and login forms and validate them with PHP.

Хобби

Опубликовано:

1 ноя 2016

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 447

@russellbrookman5388 5 лет назад

This was an excellent video. I am a pretty experienced coder who has been struggling with godaddy nonsense and I want you to know that your explanation of PHP mail functionality was excellent. Anyone watching this, like most videos, I suggest having the doc's open so you can go threw each line of code with him and really understand what he's saying.

@rickfearn3663 3 года назад

Outstanding tutorial, even after 4 years. Thanks, CT!!!

@mandude3238 7 лет назад

Two days of research to find a way to use my own pre-existing form and integrate it with mail chimp! Everything I was finding involved creating a form through mail chimp and embedding it in my site. I already have my site designed and just needed the functionality of the opt in box to work with my autoresponder list. Finally found your video that gave me the ground work to make it happen! Kudos to you sir, and thank you so much for making this video!

@ididitwriter 4 года назад

There is a lot of information on how to set-up the form and to even make the form dynamic, but nothing that actually showed the PHP information. Bravo. I actually understood it.

@tonischjelderup8708 6 лет назад

This video made me understand a whole lot more PHP and how it's working! I can't thank you enough sir!

@sorayajoost 4 года назад

I did not know codepen, you changes my live forever!!! Thank you. Cheers

@syahrian76 4 года назад

thank you for the tutorial, it really help me understanding how the validation works

@WolfRawrrr 7 лет назад

Thanks a lot for making this, I have been looking for a good php form tutorial all day. Glad I found this! Stuff works ^^

@lilithsembrace3663 5 лет назад

Thank you very much! You made it easier for me to understand the steps and how they work. :)

@theaparitchit 6 лет назад

Bingo... the way you explained it was absolutely simple and to the point.... Keep on the good work mates.... :)

@VincentWaters 6 лет назад

Great tutorial, thanks for the help - did a bit of customization and got it all working!

@VincentWaters 6 лет назад

I have noticed one issue however while testing... OK so validation & form submit both work correctly. After a successful submit, the variables get cleared and page refreshes. NOW at this point - when I refresh the page again manually (all fields empty!!) and wait a minute or two, I receive another email from the form with the previous variable intact from before they were cleared.... Any thoughts?

@FilmNotebook 6 лет назад

Great video Vladimir! Thank you for sharing this tutorial in such an awesome style! Really enjoyed it.

@albertcalvin1007 2 года назад

i guess Im asking the wrong place but does someone know of a way to log back into an instagram account..? I stupidly forgot my password. I would appreciate any assistance you can offer me.

@atlascayden5863 2 года назад

@Albert Calvin instablaster ;)

@albertcalvin1007 2 года назад

@Atlas Cayden thanks for your reply. I found the site through google and Im waiting for the hacking stuff now. Takes a while so I will get back to you later with my results.

@albertcalvin1007 2 года назад

@Atlas Cayden It did the trick and I actually got access to my account again. Im so happy:D Thank you so much, you saved my account !

@atlascayden5863 2 года назад

@Albert Calvin No problem :)

@wolfgangpauli8657 2 года назад

Very good tutorial! I built my contact form with your help and it works :) Thanks

@StefanGamer45 6 лет назад

Thank you very much for the help! I have subscribed and liked this video!

@NedumEze 3 года назад

Thanks very much, Clever Techie. Picked up a couple of sound ideas from you. I appreciate.

@clevertechie Год назад

Glad to help

@cristianramirez1160 7 лет назад

Very well explained. Thks a lot!!

@danielbocelli 7 лет назад

Thanks for this! Great video.

@gedeonszabo 7 лет назад

Working!! Finally a good source!!

@loosingahwffanboy9277 5 лет назад

They way you explain how to edit the ini file and retrieve your smtp from ur ispn SAVED ME!!!!!

@simsethi3200 5 лет назад

Thank you for the tutorial. How would i use this method if I had to choose at least one checkbox in my contact form or an option from a drop down.

@cd78 6 лет назад

Hello @clever Techie thank you for this, I was run ragged for weeks trying to do email form submits using ruby on rails and it was a fucking nightmare with the MVC architecture. PHP done this in 3 files whilst ruby had about 15. Thank you once again

@tomzell3666 4 года назад

Good stuff. Thanks man ✊🏽

@ILTECHS 6 лет назад

Awesome tutorial. Thans bro!!!

@bolyguayo9 5 лет назад

Thanks! You helped me a lot!! By the way, what if I let the "action" property empty? Is this a bad practice?

@douglasbhalandlovu4194 7 лет назад

Well explained thanks goodwork..... hope you will do one on re-captcha

@clevertechie 7 лет назад

Thank you brother

@kashlennon7344 7 лет назад

oh man thanks a lot it worked, you save my day Kudos! :)

@sonofhurin6 7 лет назад

save my day! thank you so much :)

@chandanadhikari4637 7 лет назад

Very Helpful. Thanks man. : )

@markforbes6187 6 лет назад

Awesome video! Thanks a lot

@tommy2some 4 года назад

I live in the UK and had a problem with both the $phone validation and the $url validation you're using. So I switched to (!filter_var($phone, FILTER_SANITIZE_NUMBER_INT)) for the $phone and (!filter_var($url, FILTER_VALIDATE_URL)) for the $url, which both work fine. Very well explained tutorial, thank you.

@slobodanpopovic2375 7 лет назад

Hi there!!! Thank you for this video, it's really great. I have one question. If I have one page site and my contact form is on the end of the page, how to prevent page to go back to the top if there are some error or the message is sent and make it stay on the form section? Thanks!!!

@PravinKherodkar 7 лет назад

hello Clever Techie, Subscribed! ;)

@kelahhouse4400 5 лет назад

This was well explained..thank you so much.

@ianmcl42 6 лет назад

Hey, thanks for this tutorial. I'd really like to be able to add the option to upload images, pdfs and doc attachments before hitting submit. Is there a way to add this ability to this existing form?

@sangambk9085 7 лет назад

Thank you! It really helped me a lot.

@clevertechie 7 лет назад

You're welcome!

@georgeoliver652 7 лет назад

Its great to see that there are still people as clever and helpful as yourself on the internet...

@babajiservices2998 6 лет назад

very nice helped me a lot brother good kedep going brother

@rubelrana304 6 лет назад

nice and clear video. thanks

@DanielWeikert 7 лет назад

Great Tutorial thank you!. In order to call itself we could use $_SERVER['PHP_SELF'] or the name of the php file directly. Which one is the better/more secure option? What are the differences? Thanks

@TemmyCodingLifestyle 5 лет назад

what if i have more than One form on the same page to validate using action="" How will i be able to differentiate the form

@jongan8015 5 лет назад

Just a thanks to clever techie, am an old HTML and PHP user, any recommendations of what video to watch doing a refresher course of doing html and php again, was stuck doing oracle and java for a long time. Videos like these helps. BTW where do you download the software your using.

@aaronr.trevino2712 6 лет назад

Thank you Clever Techie! I'm new to coding. The files worked after renaming my contact.html page (started with html and css) to contact.php and transferring them to the server. Had to tweak them a bit, but my contact page works great! Did catch the $message_body variable. Also added between tags (instead of inside the opening tag) in order to keep my message (textarea) from getting cleared. Watched the video again to catch the at the end that shows you how to display $success. I'll definitely subscribe to your channel!

@automatichybrid 6 лет назад

Hi there! thanks for taking the time to explain in detail. Please is there a way to record the same contact form data into mysql database at the same time? will the php connection script go into; form.css, form.php, or form_process.php? thanks

@ramirosan 4 года назад

Hey Techie! This video is great! What text editor are you using and how do you open it in the browser from the text editor. I am using VS code but I can only open HTML files through a live server in Google chrome. I would really appreciate your help.

@idlprutara 4 года назад

thank you for the tutorial

@amndev94 6 лет назад

Thank You for the the tutorial. Please help me with some doubts. What should come at "sendmail_from" in php.ini file ? what should come at $to variable in form_process.php ? Help me

@saturnosinanillos 5 лет назад

"value=" is not a valid argument for "textarea" tag....after a little research I found the right way to make it work (stackoverflow): Thank you very much ! I am a beginner and I just learned a lot from your video!

@chriseguaoba5915 4 года назад

Thanks a lot for the tutorial it very helpful

@JGameplayz 3 года назад

Hey dude!!!!! You help me a lot....thank you thank you very much.. and that was easy as Pie LOL! 🤣

@rameshgundluru7579 5 лет назад

sir i am not getting color after adding

@shitalpednekar2868 2 года назад

Nice tutorial. Thank u

@clevertechie Год назад

Welcome!

@voodoomagicman01 6 лет назад

Great tutorial, thanks a lot for sharing it has helped me a bunch!! FYI, you forgot a closing php tag on the form_process code. May confuse someone who is just starting out.

@kleysoares 6 лет назад

It worked... Thank you soooooooooooooooooooo much

@ujjwalverma7787 6 лет назад

help me dude sir, i get message "message send" but i don't get msg in my gmail inbox ??????

@muhannadjudah5302 5 лет назад

where is the code ?? plz

@gentlemanphilosopher5342 5 лет назад

Netbeans...would there be any other platform/editor that would suffice for these purposes? Thanks!

@Big-Timbo 4 года назад

there is XAMPP, which allows you to host a full website locally on your machine to test

@garyjames6168 6 лет назад

Hello. Can any help with how i would send the completed form to my workbench DB table instead of sending to an email account like the video shows?

@ghazikerkeni7031 6 лет назад

Hello! Can you add a Part 2 video on which you add a confirm screen, and a complete screen with or without sessions?

@nomadafe 7 лет назад

great job man, I would like to change on the settings the phone number you are using and maybe using a more complex tool that would detect from the ip the country list, and validate the phone number, do you know how can i do that? THanks

@alzacc2259 4 года назад

Ok so your telling me that once this has fully been coded once information has been submitted all the information goes to your email address if not then what's that called?

@mj_hinostroza 7 лет назад

Hi, I already have a html and css design and I need the php code so that the emails can be sent through my web page. When I paste the code that you link, it sends me to another page with a new design of contact.

@SurajKumar-lb1ii 6 лет назад

I upload the file on my hosting server, but whenever i send mail, it say mail sent successfully but not sending to my mail id plz help

@igerms1 7 лет назад

Thanks, do you know how to prevent page reload after submitting with AJAX?

@deepalijindal8470 7 лет назад

Thank you for this video, it is really helpful. But I also want to validate textarea field (show error message if it is empty). I applied the same logic as applied for other fields but it does not work. I am not getting error message after textarea. Please suggest something.

@herman8554 7 лет назад

Hey I am getting unknow variable $data when I try to load my page. Is it because I didn't make if statements for all variables?

@sergioc.p.7845 7 лет назад

Hi!, you don't send the message_body to your email, just the $message textarea. You need to put $message_body in mail function, don't $message var.

@clevertechie 7 лет назад

Yes, you're correct! I noticed this mistake after I already uploaded the video, thank you for mentioning this :)

@mikejacoby5150 7 лет назад

Is this why only the comments get sent? My contact form works, but in the email I received in my test, there was no name, email, ph# or website, just comments, so I have no clue who sent the message. thanks

@WolfRawrrr 7 лет назад

Yeah good spot. I actually noticed it in the video right away because he said "message body" out loud, while typing "message" so that made it apparent if you really paid attention ^^

@amndev94 6 лет назад

thank you for the correction. can you tell me how can I send an acknowledgment mail to the person who fills the inquiry form ? As in : Thank your filling up the form, the XYZ team will contact you withing 24 hours. this message should be sent after the user clicks on submit button. is it possible ?

@louie2114 5 лет назад

Thank you, helps me solve the problem!

@mezmerizer9422 4 года назад

You got me for a moment, I was skipping for 5sec getting to one part and I saw you typed in Vladimir... my name is Vladimir.

@tbdrosa8542 3 года назад

this was really helpful !! but how do you preview within the server? I am using brackets and for some reason, it will not allow me to preview the php file

@triplea7071 5 лет назад

I love u for this vid

@DanielCooke1295 6 лет назад

Can you do think same video using Adobe Dreamweaver 2018...im not sure how to implement some of the things you do into my site on dreamweaver. Thanks!

@charlesjohnzerna6028 5 лет назад

after all the validation my question is how would you insert it in the database? because sending the message to an email is not what im after for but its about on how could i save it into the database after checking or validating all data.

@mohammaddaud2312 6 лет назад

plz give php codeing ....

@kazamidori0912 6 лет назад

hi, can someone help me? i need the contact form not to be on a single page by itself, but on a page for example, at the end of the page. How can that be done? thanks alot!

@muhammedshahabaz1963 4 года назад

how to fix this error when submitting {"code "methodNotAllowedError", "message":POST is not allowed"}

@joydhar434 5 лет назад

Thanks man

@michaelzehnder3040 Год назад

Well done

@taylorhopper1316 7 лет назад

Hey Clever Techie, I am working on a website for a class right now and really wanted to incorporate something similar to what you've done here, but when i try and submit the form, the page loads constantly and never actually loads anything. It also never shows me the success message or send the email. Would you know any way around this?

@jamesbarratt593 6 лет назад

You have answered a w3schools question which they never answered after their same pho form code on how to display an error message. Awesome. I then learnt jquery and if filling out boxes wrong validation worked, only if i never filled out boxes and just clicked submit on a blank form, error messages would appear in all the form boxes and you'd stay on the html form page, only I wiuld receive an email to. Blank fields. This is obviously because php was waiting untill submit button selected as jquery was. Any obvious solution ...?

@mikeart1353 6 лет назад

Hey Clever Techie, I am using Atom Editor; So where to find php.ini file?

@adrianversey4955 7 лет назад

Hi Thanks for the great post. How would I include an email address that the sender of the message receives?

@awinil 7 лет назад

You just call another mail function with sender's email address and different body message.

@grazialotito2470 6 лет назад

Good morning, I would like to know how do you open php.ini this file. Where It is found? Then you restart Apache in the services in the windows. I wait you an answer. Thanks a lot for a video.

@myratovezov1695 5 лет назад

IT WORKS 👍

@manurajsharma9938 6 лет назад

i am using the Dreamviwer and their is no loacthost for run this an you suggest which local host i will install for testing the code.

@clevertechie 6 лет назад

Try installing spellcheck first. Do you charge for your services, how much?

@sandragraves1177 6 лет назад

Wow. Rude. There's a way to get subscribers dude. Are you serious?

@RandyNisal 5 лет назад

seriously ? Thats really rude. No one is perfect and Its not his mother language as well.. Even you have done mistakes during this tutotrial

@hottensiamukai7928 5 лет назад

the php.ini file is it in the same folder with the files you are using? If yes are we linking the page as we have done with the css and php files?

@rowanthorley6616 6 лет назад

Hi, thanks for the tutorial it works great, also you need the $message_body var in the mail function NOT just $message otherwise it will send only the message

@faceofcraze5415 5 лет назад

where do I download the PHP file from

@franktielemans6624 5 лет назад

Validation seems to work and an e-mail got send with all the inputs but my mailbox says it's coming from an unknown sender. Why is that?

@restricteduptempo 6 лет назад

Which text editor do u use?

@iamtuskie 7 лет назад

Hi, i did everything right but when I click submit I get this error on my browser "Forbidden You don't have permission to access /form/< on this server."

@Aziz-Ahmed-UK 4 года назад

Hi, can you please help me add code few more input fields to my existing contact form if I send you my php files? I am struggling at the moment. Thanks

@FuntasticMovies 5 лет назад

Why I got the php value code, shown up in the text bar in the form? Like where I got the input type text area, my website shows the code: for example. What am I doing wrong?

@JunaidKhan-kx8ui 6 лет назад

Just a couple of questions 1) I am making a forum and value="" only works for but the values in and are not remembered so is there any way around that? 2) Is there a way to remember "toggle state" so that a section of a page that is opened by clicking a button remains open after page reloads due to error?

@hottensiamukai7928 5 лет назад

he php.ini file is it in the same folder with the files you are using? If yes are we linking the page as we have done with the css and php files?

@Dexter101x 6 лет назад

Would like to have a tutorial with ajax validation that uses php with the validation

@arniie5288 4 года назад

Why didnt you get the values input (e-mail, phone...)in the outlook e-mail? Thanks

@salwaazzam5982 4 года назад

THANKS ALOT

@rvislive_ 7 лет назад

when I fill this form send then which mail it received..?

@mrsylla9533 7 лет назад

Hi! Great Tuto. But i still have a problem. I did everything as you did. But when i sens the message the message area is cleared but not the other txt areas i.e name, email...and the confirmation message is not displayed. Coule you help please...

@jeanydemapi7936 7 лет назад

i dont get the css here:( what is the next in line after container?

@morgansippel2057 4 года назад

very good video

@zzzzzz1572 5 лет назад

it work's thank's .

@mainak7146 6 лет назад

where should we include that php code in the html website. I mean in the body or head ??

@ademagba 5 лет назад

How do u process form inputs like list/select ?

@devtony03 4 года назад

Hello, I need help with this. I am following the steps provided and my form is not working. I am not using the php server. I am not familiar with php. I am using github and connecting a custom domain with godaddy. can anyone help?