HTML Form Echo

Overview

Construct a Web page (plain white is sufficient) that containins an HTML form containing most of the common form element types.

I have prepared a very simple PHP script that will accept submissions from any HTML form. It’s called echo.php because all it does is to echo a summary of the form’s data back to the Web browser as a generic Web page.

PHP Echo Script (zipped)

You should submit your form to it using a relative URL: action="echo.php"
Do Not use an absolute URL and submit to my online version of the echo program.

Note: Submitting an HTML form requires Web server software to answer the request, which passes the submitted query string as input to the server side script specified in the form’s action attribute. So you won’t be able to test your form submission locally as with the previous HTML/JS files (unless your PC is running a Web server and PHP parser). But I don’t recommend that since we will soon be working entirely on the CSCI server and interfacing with a server-side database there which won’t be local.

Requirements

We are going to use this form for several assignments, including saving the form’s data into database records. So having a form about a coherent set of data is important. A survey about some topic of interest to you is usually a good choice. (Naturally, I would survey about favorite heavy metal genres and bands.)

The requirements for the types of form elements are as follows:

• 2 text input fields - one each of: type=“text” (single line text entry) and type=“email”.
• A type=“number” input field.
• A type=“range” input field.
• Textarea (a multi-line text field)
• At least 3 checkboxes.
• 2 different unique selection groups of at least 2 radio buttons each. By a unique selection group, I mean a group of radio buttons where only one of them can be selected.
• A select dropdown menu where only one item can be selected.
• A select dropdown menu that allows multiple selections.
• A hidden form element.
• Both a reset and a submit button.

Additional requirements are a follows:

• Each form element needs a name attribute. That’s how it is identified when submitted to the server.
• Submit your form to the echo program a couple times and observe the results.
• Answer the following questions at the bottom of your echo.php script (after the HTML table) so that I can see your answers when I submit your form.
  • What does the echo script return for a checkbox if it is not checked when the form is submitted? Explain why in terms of the query string.
  • When multiple items in your multiple select menu are chosen when the form is submitted, what does the echo script return? Why?
  • Submit your form using each of method="GET" and method="POST" and observe the browser’s behavior when you hit the reload button AFTER the browser is sitting on the results returned from the echo script. Briefly explain.

Additional Notes: - You don’t need to modify the echo PHP script other than answering the questions at the bottom. - You do not need to add any JavaScript to the page with the form.

Hand In

Post your form inline and include a “FORM” link to it in your nav bar in your course page.

When I surf to your form and submit it, it needs to submit to your echo PHP script which also needs to be uploaded to the server.