Introduction
This assignment assumes you are already familiar with Chapter 5 of the textbook, and is designed to familiarize you with what actually happens when a form is submitted.
The assignment consists of a sequence of activities that use a number of files that I am providing:
- a_form.php
- This is a web page that contains a form that contains an assortment of form elements. The form is not at all typical, however, because it uses Javascript to let you choose the values of the submit and method attributes of the form interactively. These features show up as a set of radio buttons and three different submit buttons at the bottom of the form. You can view the document source to see how it’s all done.
- Form_Script.php
- Forms get submitted to programs that run on a web server. These programs can be written in pretty much any programming language, and this one is written in PHP. PHP is currently the most commonly used language for processing data submitted by forms. Other languages that are commonly used are Perl (an older language) and Ruby (a newer language). This program generates a web page that gives information about the form data that was submitted to it. If you click the link above, no form data will be sent, and it will just come back as an empty web page. (Try it.) Like all PHP web pages, the actual PHP code gets removed from the file before it gets sent to the browser; if you would like to see the actual source code, you can look at Form_Script_php.html. (Not required reading!)
- Form_Script.sh
- This file is very similar to Form_Script.php, except it is written as a shell script. A shell is a program that reads commands typed in by a user and executes them, either directly or by running another program. This script is written in the bash shell scripting language. Bash is a more primitive language compared to PHP, so it gives a little more detailed view of the information submitted to it from the form. Again, if you click on the link to it above, you won’t get much information back. And again, if you want to see what the script looks like, there is a web page at Form_Script_sh.html
- EchoHTTPRequests.jar
- This is a special web server we will use to see more precisely
how the browser sends form data to a web server. Taking the scripts
above one step further, it returns a web page that shows the actual
structure of the request messages it receives. Unlike the two
scripts above, this program handles multipart/form-data (used when
uploading files) correctly.
This program requires a current version of Java in order to run, so if you download it to a computer outside the lab, you may need to update your Java software to use it. Right-click the link above to download the file. If you left-click on it, you’ll probably see a web page full of nonsense characters; it’s a binary jar file. If you have WinZip (or the Java Jar utility), you can open the file and look at the Java source code if you are interested.
Assignment Activities
You do not have to write any code for this assignment. Just do the activities described below, and write down your answers to the embedded Activity Questions.
Interact With the Form
Go to a_form.php and make sure you know how to use all the sample form controls on the top part of the page. You will probably want to open it in a separate tab so you can switch between it and this web page easily. (Or just work from a printed copy of this one.)
Activity QuestionWhat is the essential difference between radio buttons and checkboxes?
Activity QuestionWhat are the two ways to make text start on a new line in the Text Area?
Activity QuestionWhat are the two ways to get to a specific item using the keyboard only?
Fill in the form and submit it using both the “GET” and “POST-no enctype” to Form_Script.php.
Activity QuestionWhat is the difference between the URL used by the browser for the two different submit methods?
Activity QuestionWhat differences, if any do you see in the information returned using the two different submit methods. (Hint: the answer to this question should be “none”.)
With both checkboxes checked, and with multiple items selected from the multiple selection control, submit the form (using either “GET” or “POST - noenctype” to both Form_Script.php and to Form_Script.sh.
Activity QuestionHow do the outputs from the two scripts differ from each other, and what does this say about what information the browser sends to the server?
Observe that the name of the multiple selection options all end with square brackets ( [] ); that is a trick that is used when submitting forms to PHP programs to get the items converted into a list for that programming language.
Use the Echo HTTP Requests Server
For this part of the assignment, you need to download and run special web server called Echo_HTTP_Requests.jar that I wrote. You should download and save the file anywhere you want; on your desktop is convenient. When you double-click the icon, the program will start running, provided you have a current version of Java installed on your computer. If you need to get Java, you can do so from Sun Microsystems for free; all you need is the current “JRE,” which was JRE 5.0 Update 6 at the time of this writing. Their website has instructions for installing it.
If you have a firewall installed on your computer, you will get a warning from it the first time you run the program. You will have to allow the program to act as a server in order to continue.
Normally, you cannot run two web servers at the same time on a single computer because they both would try to receive all the HTTP requests that arrive, and would conflict with each other. So my server uses a different port number (81) to avoid conflicts with Apache, which listens for requests on port number 80. If you are using a computer that doesn’t already have a web server running on it, this is not an issue and my server could work using port 80. But it always uses 81, whether 80 is already in use or not.
Type the URL, http://localhost:81 into the address bar of your browser. (You can click that link if you are viewing this web page from a computer where my server is running.) If you are in the lab, you could also use the actual name of the computer you are using in place of “localhost.” If everything is working, you will get back a web page that shows you the actual request message that the browser sent to the server. The server’s window on the left side of the screen should show the same information, preceeded by a message indicating that it received a network connection from your browser. If you get an error message or anything else other than the green page with the title, “Your HTTP Request,” you need to fix whatever is wrong before proceeding. The course forum would be a good place to go for help.
If you are in the lab, you can try running the server on one computer and accessing it from a browser running on another computer. (You can only use “localhost” as the computer name when the browser and the server are running on the same computer; in other cases you have to use the other computer’s name in the URL.)
Activity QuestionRequests for normal web pages, like the request you just made, look very much like the request that is sent when you submit a form. Look at the first line of the headers returned by the server and tell whether the request used the GET or the POST method.
Activity QuestionThe first line of the request also gives the pathname of the file being requested. Type http://localhost:81/some file/that doesn't/exist into the address bar of your browser. What does the first line of the request look like now?
Activity QuestionWhy don’t you get a “file not found” message?
Activity Question Describe in your own words the difference between the way the browser submits requests when using POST with no enctype compared to POST using multipart/form-data.
If my server messes up in any way, you can always stop it and start it over again. Please let me know if when you find something that causes problems.
We will use my server as a tool to help during the final project in the course. For now, the goal is just to become familiar with its operation. I suggest that you try submitting the sample form to it using eithter the GET or the first POST button. If you click the second POST button, you will probably have to exit and restart the server.
Examine the Javascript Code
Activity QuestionLook at the source code for a_form.php and find the Javascript that gets executed when the Submit buttons are clicked. Explain in your own words what this code does.
Submit the Assignment
Write your answers to the Activity Questions in an email, and send it to me by May 2.