code icon

CSCI 1720

Intermediate Web


The scenario here is that the front-end team has handed off a registration page for your client's upcoming conference. Your job is to develop the backend processing page that will calculate registrants' fees and provide them a confirmation number

  1. Create a new directory in your labs folder named php
  1. Download the starter files archive for this project and extract them to your working folder

We've got several files and folders, here. But most of them are completed already. The one we'll be concerned with is the php/confirm.php page

  1. Open the project in Brackets
  1. First, let's examine the form we're processing
screen shot
Fig. 1- Form declaration

Notice here that we're using the POST method to submit the form

  1. Let's start out by examining the form
screen shot
Fig. 2- Name & email
screen shot
Fig. 3- Conference package
screen shot
Fig. 4- Extras
screen shot
Fig. 5- Extras
screen shot
Fig. 6- Extras
screen shot
Fig. 7- Extras

The important attributes/values for us with regard to the backend processing are name and, for the radio buttons/checkboxes/select lists, value. These are the key/value pairs that will be sent to the processing script when the form is submitted

  1. Open php/confirm.php in Brackets
  1. If you have Live Preview open, you'll see that we have a partial page displaying, with a bunch of error messages. That's because we haven't completed the confirmation page's code yet

I left the comments in to help guide us through the remainder of the lab

  1. The first thing to do is declare some constants for the tshirt, bag, and thumb drive costs
screen shot
Fig. 8- Costs for extras
  1. Declare variables for the registrant's personal info
screen shot
Fig. 9- Getting data from the POST info

Remember, we're using the POST method, which sends the input data to the server in an associative array whose name is $_POST. So to pluck each value out, we call the appropriate key, which corresponds to the name attribute in the form

  1. One thing with text input - the form doesn't care whether we enter steve or Steve. So we want to be sure that the output value is capitalized
screen shot
Fig. 10- Capitalizing input strings

PHP has a built-in method called ucfirst(); which, oddly enough, will change the first letter of a string to uppercase

A critical security issue when you're handling user input is ensuring that the data is safe before it hits the server. PHP has built-in methods to help us with that, as well

screen shot
Fig. 11- Sanitizing input strings

The filter_var method takes two paramaters (plus options, which we're not using here) - the input string (e.g., $_POST['firstName']) and the (globally defined) filter (e.g., FILTER_SANITIZE_STRING). It will return either a sanitized input or FALSE (if the filter fails). Notice that we used a different filter for the email input

  1. The values for the checkboxes and select list don't have to be sanitized since the user is constrained to the options we've already defined. In other words, for example, the user can only select 1,2,3... for the number of tshirts they want
screen shot
Fig. 12- Storing the other input values
  1. Now we want to create a confirmation number for the registrant's order
screen shot
Fig. 13- Confirmation number

So, what's going on here?

screen shot

  1. We need to determine which package the registrant selected and assign its cost to the order. There are six options, so a switch would be most appropriate for this. First, set up the switch statement. We'll be checking the value of the $package key
screen shot
Fig. 14- Setting up the switch
  1. Now, the first case
screen shot
Fig. 15- Case 1
  1. Now, finish up the remaining cases. Remember, each case includes a break; statement to stop processing the switch when its condition is met. Remember Ctrl+d is your friend here
screen shot
Fig. 16- Completed switch

So now we have all of the input values. It's time to start tallying the cost

  1. Set up a variable to hold the total cost and initialize it with the package cost
screen shot
Fig. 17- Calculating the cost
  1. Then multiply that by the number of guests
screen shot
Fig. 18- Number of guests

Notice here that I didn't store the $_POST value in a local variable. I could have, but it's the only place I need it and, since it's from a select list, it's safe to use without sanitizing

  1. Now the options. Since they're optional, we have to include a check (isset()) to see if the value exists
screen shot
Fig. 19- Extras
  1. And now, we're done (ha! ha! -- believe that and I got a bridge to sell ya). In Brackets, go to registration.php and launch Live Preview
screen shot
Fig. 20- End of PHP code

Output File

  1. Notice that the confirmation page's HTML follows the PHP code in confirm.php. Here again we're using PHP to output information from the input form when it creates the user's 'receipt.' Look at Line 152
screen shot
Fig. 21- Embedding PHP variables in output

So this takes the $firstName and $lastName variables and injects their values into the output. You can see that the code in Line 152 creates the output table's header row

screen shot
Fig. 22- Output

On further inspection, you can see that we use the <?php echo ?> instruction in Lines 155, 159, 164, 165, 170-176, 179-184, 191-196, 200-206, 212-218, 221-227, & 232 to construct the remainder of the table for the output page

Lines 170-176, 179-184, 191-196, 200-206, 212-218, 221-227 use embedded PHP to check whether the user chose to order optional items

screen shot
Fig. 23- Output


Troubleshooting with PHP can be a pain. Sometimes error messages don't display when it's run. But, remember our lecture on Developer Tools. Using the network tab will reveal error messages that don't make it to the display - From the DTs, when you run the erroring script, click on its filename to see what its output was

  1. Fill out the form with test data - first, fill it out correctly. You may get an error or errors when you test your script. Sometimes, the error messages will show up in the output. If they don't, see above
screen shot
Fig. 24- It blew up

So this error message is telling you that firstName is undefined and it encountered the problem on Line 99 of confirm.php

If you run into errors, try to puzzle them out on your own. I'm happy to help, but you'll find that there's a pretty big sense of satisfaction in winnowing out your own bugs

Don't forget: When you make changes to your source files, you have to re-upload them to the server to test them

Finishing up

  1. Test the form with incorrect data: leave out first and/or last names; incorrect email address format (we're using HTML for form validation for these fields, in addition to using PHP to ensure that the data the user is entering isn't malicious); check to see that the ucfirst() function is working properly, etc.
  1. Once everything is working as it should, copy the URL of the registration page (e.g., into a text file and upload it to the PHP folder on D2L

Have a nice day 😊