[Zac Gordon] At this point in our PHP development career, we should know how to work with forms.

Still, let's take a moment and do a quick overview of how forms work

especially within the WordPress environment.

The first thing to know is that in WordPress, we used the post format,

which means that the data is pass behind the scenes directly to the server and not stored in the URL like a get request.

We will have a form in our plugin setting page for the user to enter their treehouse username.

When we design the form, we will set up the opening form tag

with the name attribute, a method attribute set to post, and then an empty action field.

The empty action field ensures that when we submit the form the content will go to our main plugin file.

Even though, we're calling it from an included plugin settings template file.

Our form fields will include a hidden field with the name attribute of wptreehouse_Badges_form_submitted

with a simple value of Y for yes.

This will let us test that the user has submitted the form.

We will also have a field for the user to enter their username.

Once the form gets submitted, we will check in our main option page function that the hidden form is set in a value equals Y.

As with all form data, we will make sure that we properly sanitize

and escape the data to prevent the user from entering malicious code.

We can then test the user has filled in the username and escape that content as well.

With the username stored, we could check to see if a profile page exist on the treehouse site,

which we'll look at how to do in the future video.

If either the username has not been submitted or profile page is not exist for that user, we will then reload the form

and display a relevant message.

If you've worked with PHP forms before, this should all make sense.

Now, let's jump in, code our form, and runs some simple validation.

The first thing we're going to do is come into our option page rapper file down to our form element

and create a name attribute

that's equal to wptreehouse_username with form at the end.

I've also noticed that we have a spelling mistake where we forget the r in username.

This would cause us big problems later on, so let's go ahead and add it now.

Now that we have that setup, we could come in and create our hidden field that tells us whether the form has been submitted.

We'll create an input field

set the type equal to hidden

the name attribute

equal to wptreehouse_Form_submitted

and then set the value equal to Y.

Now that we have this done, let's come back into our main plugin folder, come down into our options page,

and write below where we'll pull in the plugin URL, let's create an "if statement" to check that our form has been submitted.

To do that, we'll write an if statement and then say if a set

the post value wptreehouse_Form_submitted then do the following.

If we know that this form has been submitted, we could then come down and assign a variable called hidden_field

set it equal to this post value up above, which we'll copy

and then for security purposes, we're going to wrap that value inside of an escape HTML function.

Next, we're going to check to make sure that our hidden_field value is set to Y.

If it is then we'll create a new variable called wptreehouse_username

and assign that to value of the escape

post value wptreehouse_username.

Now, that we have this set up, if the field has been submitted, we should get our username.

Let's go ahead and write a brief echo statement here

come back into our plugin page, try submitting a username,

and we should see it displayed at the top of the page.

However, if we come back to this page again, that value no longer appears.

This is because it isn't being stored.

So, a little trick to get around this is that if we enter in a value, hit submit.

We see it and if we refreshed the page, it'll ask us if we want to resubmit that form data again.

If we hit continue, then it will still have that value.

Now that we have that value, we're going to write some simple conditional statements

then make sure that if the username is blank or not filled in, it only shows this first box.

However, if the username has been submitted, it will show the recent badges as well as the profile information.

Let's come back into our main plugin file, delete our echo statement,

and then come into our options page rapper include.

We'll start right at the beginning of the first post class for the let's get started message.

And, we'll write a conditional statement that first checks to see if the username has not been set

or the username has been set

but it's not equal to blank.

Then, we'll come down at the bottom of our post box

and write an outstatement

come down to the bottom of the next of post box

and then close our if statement.

Then, we'll come back to our plugin page

click on it to make sure the form data isn't save,

and we could see that we just have the field that we want.

However, if we entering a value, we should no longer see this field and instead see the most recent badges.

Let's click save and we could see that something isn't working here.

It probably has to do with our conditional statement

and if we come back up it looks like we're saying if the username is not equal to blank

but what we really want to say if the username is blank.

Let's go back, try this again,

submit it, and wee see that it's properly working.

Now, we know that we have a working conditional statement and we can return back to this profile section

and make sure that it only displays when the username is submitted and not equal to blank.

So, we'll come back into our rapper page, copy this if statement here,

come down to the post box for a profile information, paste it in

and then make one small change.

We actually want to make sure that if the value is set and is not equal to blank

then display the profile information.

We'll come down under the post box

and close everything off.

When we come back into our page now,

we could see that when we start, all we have is the request for their username

and then when we submit it, we see the information show up.