introduction to web programming building a form processor Okay, now that we know how to read and parse incoming form data, it is time to put all the pieces together and write or first CGI program.

The most basic CGI program is the Form Processor that simply reads incoming form data and processes it. In this section, we will create a form processor to simply grab form data and echo it back to the web.

As always, first we will need an HTML form so that the user can submit some data. In this case, let's take advantage of the printing functions in perl and have a CGI script dynamically output he HTML instead of having an purely-HTML-based form. Consider the following script:

#!/usr/local/bin/perl
print "Content-type: text/html\n\n";
print qq!
  <HTML>
  <HEAD>
  <TITLE>Testing Form Input</TITLE>
  </HEAD>
  <BODY>
  <FORM METHOD = "POST" ACTION = "fp.cgi">
  <CENTER>
  <TABLE BORDER = "1">
  <TR>
  <TH>First Name</TH>
  <TD><INPUT TYPE = "text"
                NAME = "f_name"></TD>
  </TR>

  <TR>
  <TH>Last Name</TH>
  <TD><INPUT TYPE = "text"
                NAME = "l_name"></TD>
  </TR>

  <TR>
  <TH>Email</TH>
  <TD><INPUT TYPE = "text"
                NAME = "email"></TD>
  </TR>

  </TABLE>
  <P>
  <INPUT TYPE = "SUBMIT">
  </CENTER>
  </FORM>
  </BODY>
  </HTML>!;

As you can see, this script simply outputs an HTML form. On the web, the following CGI script would produce the following interface:

[Example]

As you can see, when the user hits the "Submit" button, they will send their information to fp.cgi via the POST method. Let's take a look at fp.cgi:

#!/usr/local/bin/perl
require "cgi-lib.pl";
&ReadParse(*form_data);

print "Content-type: text/html\n\n";
print qq!
  <HTML>
  <HEAD>
  <TITLE>Testing Form Input</TITLE>
  </HEAD>
  <BODY>
  <TABLE>!;

foreach $key (keys(%form_data))
  {
  print qq!
  <TR>
  <TD>$key</TD>
  <TD>$form_data{$key}</TD>
  </TR>!;
  }


print qq!
  </TABLE>
  </BODY>
  </HTML>!;

fp.cgi will simply read and parse the form data and then echo back the user's input. The following figure shows a typical response:

[Example]

Notice that the form values do not come in the order that you specified on your HTML form. This is because associative arrays store their name/value pairs using their own logic for memory savings. You have to write your own logic for sorting name/value pairs if that is important to you.

Previous | Next | Table of Contents