Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
What I want to do now, is talk about forms and the form process. And we'll take a look at a couple of examples of forms, in order to do that. I'm on the Video2brain website. This is their homepage. And they have a subscribe to our newsletter link. So if I click that. I have gone out to a form, for me to fill out, if I want to become a subscriber to their news letter. Now you can see this form, has a few different fields within it.
Each one of those is known as a field, there's also a few extra check boxes within this form. The idea is, you fill out form with your information. You check the check boxes if you want to, and you'll click Save. Now if I click this button right now, you can see there's some information that pops up on the page, in other words, I have not filled out all of these required fields.
And that message that pops up, and the script that creates that blockage, so to speak, of the form being submitted is known as form validation. So this is using a process called server side validation. Server side validation, actually sends the form data to the web server, the web server checks to see if the data was filled out correctly. And the web server sends back a new page with this red writing in it, letting the user know it wasn't filled out properly. So, this is known as server side validation.
You send the form to the server, before it gets tested. Now, there are other types of form validation seperate from that. If you go over to my website, my contact form, just four basic form fields, this doesn't need too much information. But if I click the button here, this is set up a little bit differently. This is actually using something called spry validation. But notice with this type of validation, I get my message very close to where the form field is located.
I also have the form fields show up in red. If I first load this form. We'll reload the the page here and when I do that, you can see how there's no color inside the form field. When I click this, it's red, and if I end up typing incorrect information, you can see while I'm typing it's yellow, and if I click. And send correct information in that field, it turns so spry validation also includes some CSS features, and you certainly don't have to keep this color arrangement you can customize it if you want.
But it's built in to spry automatically, so this is spry validation. Spry validation is client side. This form does not leave my computer and get sent back to the server unless there is corrected data inside of it. And there is pros and cons to all these different methods of form field validation, so as we go to do each one I'll talk about. The specific pros and cons of that particular method. But all of these processes involve the form page itself.
Then when you click the Submit button, the data inside the form, whatever I put inside these fields, gets sent to the web server. And on the web server, there must be some kind of page information, some kind of a form script, generally referred to as the action script. That takes that form data and does something to it. Now if I fill out this form correctly and click this button, then I will actually get an email in my email system. There's a script sitting on the server, that takes the information that the user puts inside each of these, puts it into an email for me. And actually sends the email so I receive it.
So there's the form page here, and let me go ahead and fill this out so you can see. So, bear with me while I type this out. I'll just say hello. Hello there. Now, when I go to send this. I'm actually going to be taken to a thank you page. So, this is another page. So, in order to create this form process, I need the form. I need a script on the server, that's known as the action page. And then I also need some additional information, somewhere to send the user once they've submitted the form.
So there are three steps for this form to email process, and we're going to take a look at building all of those. So that is the basic process for a form and how it works, and we'll put together all of those pieces during this course.
Get unlimited access to all courses for just $25/month.Become a member
61 Video lessons · 92409 Viewers
82 Video lessons · 104127 Viewers
71 Video lessons · 75558 Viewers
56 Video lessons · 106939 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.