8.5 Getting Data From the User

In the previous lesson, we modified our getMessage function so that it will actually process data. It accepts a numeric value, and then it displays a message based upon that value. So all we need now is a page so that the user could choose what time of day it is, morning, afternoon, or evening. And then we will take that information and display the appropriate message. So we're going to start with the markup, now, I've already gone ahead and written the markup. It's in a file called markup.html and this is of course going to be part of the code download, so you can feel free to start with this html. And just to go over it, there's a form, it has a name of the form, there is no action set yet. We will be doing that here in a few moments, and the method is set to post. So this is going to send a POST request to whatever we set as the action. Inside of the form there is a select element, its name is time-selection. And there are three options, morning, afternoon, and evening and the values for those options are zero, one, and two. So this is where we are going to get our data, from this value attribute for these options. And then there is a Submit button and that's it, so let's take this markup, and let's create a New File. Let's call this gettime.php, and let's just paste this html in, now we are going to mix html and php together. So that we can actually process data within the same file and output data. But if you'll remember, our getMessage function isn't in this file, it's inside of the message.php file. Well, we can include a php file inside of another php file, it's very simple to do. But first let's go ahead and let's get rid of this call to getMessage inside of message.php. Because we don't want to call this function unless of the user has submitted the form. So inside of message.php, we are just going to have this getMessage function. Let's go back to gettime.php, and at the very top, we are going to include our message.php file. So we're going to start with our php opening tag, and then we are going to call a function simply called include. And we specify the file that we want to include, that is message.php and then it's going to include that file. So that now inside of this gettime page, we have access to getMessage. So if we wanted to, we could go ahead and call getMessage, pass a value of two, and we will see the Good Evening message at the very top. So let's change this to gettime, we have our form, but also we see Good Evening at the top. And the reason why is because we called that function and it is going to call, regardless of whether or not the user submits that form. Now, we only want to call this function when the user submits the form, so let's not call it there. Instead, we want to check for when the user submits the form, that is a post request. And we can check for a post request very easily, we are going to make a decision here, if it is a post request then we are going to execute the getMessage function. So we are going to use the if statement and we want to know what type of request was made. Now there is a global variable called _SERVER, and this gives us a lot of information about the server, in this case, we want to get the type of request that was made. So we have $_SERVER and then a pair of square brackets, and inside of the square brackets, we are going to say that we want the REQUEST_METHOD. So this _SERVER variable is available everywhere, this is a global variable that we have access to. And we are getting the REQUEST_METHOD from the server and we want to see if that is equal to POST. And if it is, then we are going to execute our getMessage function, however, we need to know what value to pass to getMessage. So in order to do that, we are first of all going to create a variable, let's just call it value just to be simple. And we are going to use another global variable, it's called _POST. So for POST requests, we can use this _POST variable to get anything from the form that was posted to this page. And in this case, we want to get this select value, so whatever option is selected here, that value is going to be sent with the name of time-selection. So just like we used the square brackets for the _SERVER variable and we said REQUEST_METHOD, we're going to do the same thing for the _POST variable. But instead we're going to use the name of our select box which is time-selection, and that is going to give us the value that was selected. So that then we can pass the value variable to getMessage and that will display our message. So let's go back to the browser, let's refresh, now what we just did was a GET request. The majority of requests that we make are GET requests, if you go to tutsplus.com and press Enter, that is a GET request. If you go to google.com and press Enter, that is a GET request. A POST request is usually made from a form and that is what we are doing here. And the difference is how the data is sent with a request, with a GET request all of the data is part of the URL. You've probably seen URLs that have the host and then perhaps a file like in this case, and then a question mark and then there might be foo=bar or something along those lines. That is how you get data in the request using a GET request. A POST request is different, you don't see that as part of the URL, instead it is sent as part of the request body. And so in this case, we're going to choose one of these values, let's choose afternoon. Whenever we submit, that's going to send a POST request back to this same page and we see Good Afternoon here at the top. Now that's not very useful, instead of showing this at the top, it would be nice to see it down here at the bottom, because this really doesn't make a whole lot of sense. So let's go back to our code, and let's modify our getMessage function, so that instead of just echoing the value, it's going to return the value. This means that whenever we call getMessage, it's going to give us back a value that we can then use. So whenever we call getMessage inside of gettime, we want to create a variable and store the result of calling getMessage in that variable. So let's just call that message, so we have message=getMessage, and then we want to display the message somewhere within the body of the page. Let's do that after the form and let's use a p element to display that. So here we have a couple of options, the first is to echo our value, so we will have our php tag, then we will say echo and then message and that will work. So let's go back to the browser and let's see that in action. Now if we just refresh this, the browser is going to ask, okay, your last request to this was a POST request. Do you want to resend that same request? In our case, we could do that, that's fine, if we hit Continue then we can see that our last request was for Good Afternoon. But instead of seeing it at the top before the actual content within the page, we see it below the form. And if we look at the markup, we are going to see this p element that has our Good Afternoon message after the form, so right where we wanted it to go. However, there's an easier way to do this, instead of having the php tag, let's just get rid of php here. And instead of saying echo, we are going to use an equal sign, this is a short hand version of echoing data. So we have open angle bracket, question mark, equal sign, our message variable, and then the closing tag for our code. And that is going to give us the same exact results, so if we refresh, this is going to submit that Good Afternoon request again. If we hit Continue, we see the same thing, if we resubmit this form with Morning selected, we see Good Morning. If we go to Evening and submit, we see Good Evening. So now we have an application that not only processes data, but it processes user input. Of course, this is a very simple example, but it gives you a starting point for writing your applications. You can take the concepts that we have talked about and apply them.