Simple HTML Form

7 minutes
Share the link to this page
Copied
  Completed
Learn about implementing simple HTML form with a PHP backend

Transcript

Hello, in this video, we are going to cover a, you know, creating a simple HTML form. Over the next few videos we'll be looking at, you know, difference between GET and POST. Now form security, you know, validating, you know, email URLs, all that stuff, because we built on top of what we do here. So first of all we're literally going to do, we don't actually need any PHP on this page, what we're going to be doing, we need some HTML. So HTML, we're gonna have a body tag. And obviously, you could have a head tag for total all our stuff in there.

We're going to keep it simple. We just want we need to create a form you put form, like so. Inside here with a few different things you can put an action and this is basically the page that this form will take you to when you like click go for example, or submit. So I'm going to call this to do user. So we might need a user takes a user dot php, we haven't created that yet. And we will in a second in this video, can you put the method and I'm going to say, post.

But I will cover the difference between post and get in the next video. So don't worry. Just you know, think of it as like a requirement for now, but I will cover in the next video. And now let's sort of format it. So let's say if we knew the name, they might need, like a login form, for example, per input. Next to it, you can always spruce this up a bit of styling.

I'm keeping it very simple. The type is text. And this is all HTML. So feel free to check more help them out on the web school website on you know, anywhere that you can find and name is this is important. So the name that we assigned here is what we'll use to get the value back in the on the page, aka the user dot php page I want to call it user name and now I'm going to put a new line tag here and I'm going to put a password field we're not doing any login songs so creating this will format of what you would be used to a most websites and this is basically where they stopped and type we're gonna put his text name is going to be the type they actually have a type Now I'll show you this in a second but again this this is an HTML video I won't cover too much I will show you for the name and password.

Yeah, we need one more thing which is a button and this is an input and we'll just put type of Submit. I always like to close the tags off to requirement in ex HTML so strong you know when I used to do variable x h Development and XML. It's also good practice for that. So this is what we all get in. And you can change that by putting a value tag in there and changing what it actually shows. So if I click that, or one second, if I type in the username type in Yeah, it's no good.

We want to know, Asterix, we change the type to password and reload it looks like I already submitted it, or they're not worthy. Okay, so if I type something in, that's what we want right there. So we want to ask for it. So it's, you know, it's a bit more secure, a bit more hidden. And if we click Submit, we get object not found. Try to go to that user dot php file.

So let's literally create our right now, a new file, you learn PHP, so if I just refresh this now, it works fine. We found a file, which is fantastic. And what I'm going to do here is to get the values in PHP is you do Oh, let's get the value for $1 username. So this does not have to be the same as this name here that comes, you know, later. And I'm going to put vi here just to you know, make sure that point gets, you know, you know, right inside your head, because this can be named different. And this is going to be equal to dollar underscore post.

So this has to be the same or you know, this part right there. But again, I want to cover that in the next video in more depth NATO square bracket, quotation marks inside and here is where this goes, so please Copy that. Paste up there. We've got the volume, literally echo out dollar username bar and I fought reload that undefined index and let's go back to the homepage and properly submitted with a valid a four port. Submit so we get that. Pretty darn cool.

Okay, so the next thing that we can do is get the password. And that's basically the same thing as password law. We need to print it out from the put dot, dot password will format it so the colon in between it If I go back, and let's say, on for, let's say for password as password 123. And I click enter, it shows the password, I've got that typical say password because it's detected that the HTML form had the password in there. So don't forget that. And as you can see, when he actually gets into the page, it's not hidden.

It's in, you know, actual text form. You can secure it when you're storing a database or doing something on it. And I'm going to cover that in a separate video. But this is basically it. What you can do as an extra task is actually utilize this inside some HTML. So create some HTML code here called White this you can play HTML code in a PHP file.

And like credit or welcome, Peter says welcome then the username and they can say your password is very secure, and you can utilize these variables. If you have any questions, feel free to pop me a message and as usual I look forward to seeing you in the next video.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.