Lesson 2	How Web Forms Work
Objective	Learn the process for creating interactive forms.

How Web Forms work with Perl

The Forms interface is the basis for most interactivity over the World Wide Web. With the advent of other technologies, such as Java, it is no longer the only method, but it is still the most popular and by far the simplest. Learning about forms is going to be critical to most of the CGI programs you write. Both of our class project programs, the Guestbook and the Email form, use the form elements and parsing techniques covered in this module.

HTML and Forms

The Forms interface is accomplished by a set of HTML tags, which build the forms on the user's Web browser. The form elements are encapsulated in an outer container built with the FORM tag:

<FORM {attributes . . . } >
   {form elements} . . . 
</FORM>

Within the FORM container, each of the form elements are defined with tags that are specific to the given type of element. Each of the elements is also constructed with a number of attributes, some of which are common for all elements, and others which are specific to certain elements.

Form Element Tags in Perl

Here is a list of the form element tags used within the FORM container:

<INPUT TYPE=TEXT>     A single-line text area 
<INPUT TYPE=PASSWORD> Like TEXT, but obscures the typed text 
<INPUT TYPE=CHECKBOX> An on/off selector 
<INPUT TYPE=RADIO>    Grouped on/off selectors 
<INPUT TYPE=SUBMIT>   A button for submitting the form 
<INPUT TYPE=RESET>    A button for resetting the form 
<INPUT TYPE=HIDDEN>   An element that is not displayed 
<INPUT TYPE=IMAGE>    A graphical version of SUBMIT 

<SELECT>              A multiple-selection element 
  <OPTION>
  <OPTION>
  <OPTION>
  ...
</SELECT>

<TEXTAREA>            A free-form text area. 
  { text ... }
</TEXTAREA>

For each of these elements, the browser creates a graphical object, called a widget, that conforms to the conventions and constraints of the user's operating system and display environment. Keep in mind when laying out your page that the widgets displayed on the user's system may look very different and have different dimensions than those on your system. There are no uniform conventions for creating these widgets.

Form Element Attributes

`NAME={name}`	The name of the element, for identification by the CGI program
`VALUE={value}`	The default value for the element
`SIZE={number}`	A physical size for the widget, if applicable
`MAXLENGTH=`{number}	For `TEXT` and `PASSWORD`, the maximum number of characters that can be entered
`CHECKED`	For `CHECKBOX` and `RADIO`, use this attribute to have the widget default to its "on" state.

HTML::FormHandler

HTML::FormHandler is a form handling package that validates HTML form data and, for database forms, saves it to the database on validation.
It has field classes that match various data types and HTML form elements, and rendering roles that can be used to render forms in many different ways, from hand-built forms to totally automated rendering. It can, of course, be used to validate data even if you are not interested in the rendering capabilities.
A FormHandler 'form' is a Perl subclass of HTML::FormHandler for non-database forms, or a subclass of HTML::FormHandler::Model::DBIC for database forms, and in it you define your fields and validation routines. Because it's a Perl class written in Moose, you have a lot of flexibility and control.
You can validate with Perl methods or Moose type constraints; you can use your own validation libraries. You can define your own field classes that perform specialized validation. When the form is validated, you can get the validated values back with $form->value

Before you get started on this exercise, you may want to refresh your memory about what you will need in order to run CGI on your server.
This list from Module 1 should help you.

Preparing to run CGI on your Server

Below are the questions you need to answer before you can run a CGI program. Make note of what you find out and send it to us by pasting your notes in the text area at the end of this page. That will serve as the results of this exercise for you, and it will also help us to assist you should you have any problems running your CGI programs later on in the course.

linux.org
apache.org

This configuration will be plenty fast for your local testing purposes.

Computer chips are used for modern servers running Ubuntu Linux

Modern servers running Ubuntu Linux typically use two main types of computer chips:
Central Processing Units (CPUs): These are the brains of the server, responsible for executing instructions and managing overall system resources. There are two main vendors for server CPUs:

Intel Xeon: These processors are known for their high performance and reliability, making them popular for demanding workloads like databases, virtual machines, and web hosting. They come in various core counts, from single-core to over 60 cores, and clock speeds ranging from 2 GHz to over 3 GHz. Some popular Xeon model families for Ubuntu servers include Gold, Platinum, Silver, and Bronze.
AMD EPYC: These CPUs offer competitive performance to Xeons at a lower cost, making them attractive for budget-conscious server deployments. They also boast higher core counts, with some models reaching up to 128 cores, making them ideal for highly parallel workloads like machine learning and data analytics. Popular EPYC families for Ubuntu include 7003, 7002, and 7001.

Memory (RAM): This is where the server stores data and instructions that the CPU needs to access quickly. Modern servers typically use DDR4 SDRAM, with capacities ranging from 16GB to over 1TB. For memory-intensive applications, it's crucial to choose the right capacity and speed to avoid bottlenecks. In addition to CPUs and RAM, other essential computer chips in modern servers include:

Motherboard: This board connects all the server's components, including the CPU, RAM, storage controllers, and network adapters.
Storage controllers: These chips manage the server's storage devices, like hard disk drives (HDDs) and solid-state drives (SSDs).
Network adapters: These chips enable the server to communicate with other devices on the network.

The specific types of chips used in a server will depend on its intended purpose and budget. For example, a web server might prioritize high clock speeds and multiple cores, while a storage server might require more extensive storage controllers and high-capacity RAM.

Perl interpreter

2. What is the location of the Perl interpreter on your system?
If you are using Unix, you will need to make sure that the "#!/usr/bin/perl" line in the program agrees with this location, or it will not work.
If your system is not Unix-based, you will also need to find out what procedures are necessary to run Perl with CGI on your system. You will probably need to remove the #!/usr/bin/perl line from the top of the Perl script and run a special container for the Perl interpreter. If you are running an Windows based server, you should take a close look at Tom Christiansen's Latro page, which will alert you to some potential security hazards when running Perl (or any interpreted language) on Windows-based servers.

3. What directory do you need to put your CGI program in?

This will be different for every server.

4. What filename restrictions are there for CGI programs?

Some servers that allow CGI programs in the document tree require that their filenames end in .CGI. You will need to find out about this.

5. What permissions or attributes need to be set for your CGI program to execute?

In Unix, it is usually sufficient to use this:
chmod 755 filename

6. What is the URL to access your CGI program?
This will depend on the answers to questions 3 and 4. If you must put your CGI program in a special cgi-bin directory, the URL will probably be something like http://www.yourserver.com/cgi-bin/hello.cgi.
Answering these questions before you try to run your first CGI program will alleviate 90 percent of the problems most first-time CGI programmers experience.

formtest.cgi

#!/usr/bin/perl

$CRLF = "\x0d\x0a";

print "Content-type: text/html$CRLF$CRLF";

foreach $pair (split(/&/, $ENV{'QUERY_STRING'})) {
  $pair =~ s/\+/ /g;
  $pair =~ s/%([\da-f]{2})/pack('c',hex($1))/ieg;
  ($_qsname, $_qsvalue) = split(/=/, $pair);
  eval "$$_qsname='$_qsvalue'";
  }

$title = $blue ? "I'm Blue" : "Big Light in Sky";

$listening = $listening? "Yes" : "No";
$blue = $blue ? "Yes" : "No";

print <<HERE;

<title>$title</title>

<table>
  <tr><th align=right>Name:               <td>$name
  <tr><th align=right>Age:                <td>$age
  <tr><th align=right>Are they listening? <td>$listening
  <tr><th align=right>Are you Blue?       <td>$blue
  <tr><th align=right>This form is:       <td>$formis
  <tr><th align=right>This form is also:  <td>$formalso
  <tr><th align=right>The secret word is: <td>$info

</table>
HERE

Simple Form - Exercise

Click the Exercise link below to install a simple HTML form and corresponding CGI program on your server.
You will be working with the formtest.html and formtest.cgi files.
Simple Form - Exercise