Lab 3: CGI with PHP

Introduction

This week will be an introduction to CGI programming with PHP. To do this, you will go back to the HTML form you created for your website in Lab02, and put some computation behind it to really keep track of registrations/signups.

Read the entire lab so you see the requirements and know what is coming.

Part 0 - Setting up (5%)

  1. Directory:You must create a folder in your public_html/IT350 folder called Lab03 and store your work in that directory. To run a script called yourfile.php stored in your Lab03 directory on public_html/IT350, type http://midn.cs.usna.edu/~mXXXXXX/IT350/Lab03/yourfile.php in the address bar of your browser (replace XXXXXX with your alpha). You should COPY your files from Lab02 into this directory and make changes to them here! See the figure at the end of this lab regarding where files should be. Make sure you do not modify the files in previous labs folders. Make sure files in previous labs folders are not open in your editor!
  2. IMPORTANT: To allow the webserver to later create files when running a PHP script, the webserver user might need to have extra permissions on your Lab03 directory. To enable this, ssh into midn.cs.usna.edu. Use your normal USNA credentials. Type the following in the command window that appears: 
    
cd ~/public_html/IT350/
chmod -R a+rwx Lab03

Part 1 - Print values (55%)

  1. Form: You should have the file registration.html that contains the form from Lab02, copied into Lab03. If that file is not called registration.html, rename it registration.html. Your form should contain one (or more!) instance of the following input types: text, password, checkbox, radio buttons, textarea, submit. Your form will likely contain more than just these. Make sure all your input fields whose values should be sent to the server (e.g. input, select, textarea) have a name. See Hint#1 about checkboxes. Modify the form in your Lab03 directory so that when you click the submit button, it invokes a new CGI program submit.php which you will write next.
  2. Script: Create a new PHP script, submit.php, which, for now, reads in at least one value from your form and displays the value in its resultant HTML output.
  3. Input validity check: Modify submit.php to validate some of the input that your form provides to your CGI program. If an error is detected, your program should state explicitly what the error was, and tell the user to hit the back button and try again (see extra credit for a better approach). For the validation you should at a minimum check the following (you can of course do more if you like):
    • For your first (or only) text field, ensure it is filled out (not empty)
    • For your first (or only) set of checkboxes, ensure at least one checkbox is selected. See the "Hints" section for a discussion about checkboxes.
    • For your first (or only) set of radio buttons, ensure at least one radio button is selected.
  4. Confirmation: Modify your PHP code (submit.php) so that, if the variables pass all the validation tests above, the program prints out a user friendly confirmation. This confirmation should display the value of all the variables (and print "***" for password) that were provided in a user-friendly manner.
    A page with a raw list of variables and their values is not so friendly -- you should at least have a reasonable title, some welcome text, then a reasonable confirmation of their values. Imagine this was on your website and you wanted to present a reasonable appearance to someone that just submitted your form. Example: 'Your registration for the Naval Academy Sailing Program has been confirmed. The details for your registration are as follows'...
  5. Valid HTML5: Make sure the HTML page generated by sumbit.php validates as correct HTML5 code. You do not have to include the button from the starter page into the page generated by submit.php (but you can), but you have to ensure the page generated is valid.

Part 2 - Save values (95%)

  1. Logging: Modify your code (submit.php) so that it records all of the form fields in a file called LOG.txt (file names are case sensitive, so please pay attention to the name). You will want to append to this file, so it contains a history of everything that has happened. If and only if the values pass your 'Validity' test, then write all the form's parameters provided by the user to LOG.txt. The values provided by a single user should all be on a single line. Use a tab ('\t') as a separator.

    Here's an example of how a simple LOG.txt file might look after 3 users submitted forms that passed the Validity test:

    Joe Smith       m201234 4   Fencing,Boxing  New York
Jane Weymouth   m223214 2   Volley  Alabama
Greg Jones      m215436 1   Soccer  Washington

Challenge Problem - Just a bit more (100%)

  1. If your program finds a validation problem with an input (such as a missing value or a number that is too big), a much better way to handle this is to have your CGI program regenerate the form with all of the values provided by the user filled in, and values that had a problem should be marked somehow, for example with *. Of course, there should be a submit button so the user can modify the values and resubmit back to the CGI program.

General Requirements and Deliverables

  1. Documentation: ensure you have appropriate comments in your PHP scripts.
  2. Links: Create two links in your top-level IT350.html page under the heading 'Lab03'
    1. Under the name 'Form', make a link to your Lab03 form page (Lab03/registration.html)
    2. Under the name 'LOG.txt' make a link to your log file (Lab03/LOG.txt)
  3. Always put a README.txt file in the lab directory. At a minimum this file should have:
    • *Lab number
    • *Your name and alpha
    • *Collaborations in completing this lab (people, online sources used outside the course website)
    • *How far you got (through which part did you finish)? If you tried any additional parts beyond the one you completed, what did you do?
    • *How long this lab took you
    • Any suggestions to improve the lab
    • Any comments needed for the instructor to review the lab (usernames, passwords, etc.)
    Note that * items are required for every lab submitted.
  4. The file displaying the form for this lab should be called registration.html.
  5. Your main PHP file should be called submit.php
  6. All of your files should be in a folder called Lab03 in your public_html/IT350 folder. Your instructor will assume that your web pages are viewable at http://midn.cs.usna.edu/~mXXXXXX/IT350/Lab03/registration.html where XXXXXX is your alpha number.
  7. All labs must be complete and saved to the midn.cs.usna.edu drive before you submit your assignment. Do NOT modify your web files after you have submitted your assignment (unless you resubmit, which you can do as often as you like up until the deadline.)
  8. Submit all files to the online submissions system (submit.moboard.com) on or before the due date, this is Lab03. Use the command line submit script and capture the entire contents of the directory. The easiest way to do this would be to cut and paste the following while logged onto the server: 

    cd ~/public_html/IT350
~/bin/submit -c=IT350 -p=Lab03 Lab03
    This assumes that the submit script is located in ~/bin/ and is executable.

When finished, the structure of your web site should look like this: (items in blue undergo modification during this lab)

\\midn.cs.usna.edu\mXXXXXX\public_html\IT350

IT350.html(main page with links to all labs)

images/(images folder might optionally change for this lab)

Lab01/

index.html

Lab02/

index.html

schedule.html

registration.html

Lab03/

index.html (the main page copied from Lab02, with a link to registration.html)

schedule.html (copied from Lab02)

registration.html (copied from Lab02 and modified)

submit.php (main PHP script created for this lab)

LOG.txt (created and updated by the webserver when submit.php is invoked)

Additional Hints/Clarifications

  1. Checkboxes are interesting because more than one can be checked. If you give the same name (in HTML) to all your checkboxes and the name ends in "[]", for example 'mychecks[]', and if you write something like this in PHP:
    $checks = $_POST["mychecks"];
    $checks will contain an array with the values of all of the 'mychecks' checkboxes that were checked.
  2. If your code is not working, read the error messages in the Apache log file. 
         
     ssh midn.cs.usna.edu
     tail -f /var/log/apache2/error.log | grep mXXXXXX
    Here is a list of PHP errors and the likely solutions: PHP errors explained
    If you have logical errors in your program, try adding extra echo commands to see what parts of the program are executing and what the values received by the prgram are.