by Curtis Carmichael

 


____________________

Creating Forms

You might want to add a form to a Web page to review customer feedback, have the ability to conduct e-commerce on the Web, or just allow the user to send you common messages. Implementing forms can be somewhat of a hassle when adding them into complex page layouts. You may want to insert a table inside the form area to organize the form fields better rather than cramming all the fields together. (Refer to the previous discussion of how to implement tables).

The form field construction set can be found to the end of your task bar. There should be 6 grouped icons. Again, the capabilities of these icons will produce a short description if you do a mouse-over. In order from left to right, they should be labeled "One-Line Text Box", "Scrolling Text Box", "Check Box", Radio Button", "Drop-Down Menu", "Push Button".

Try clicking on all 6 buttons to see the function they create. Now that you have a sense of what the button functions create, delete everything and start creating your personalized form. You might find it helpful to first draw your form out on paper to decrease the chances of irritation, if you have limited experience creating forms.

When you have your plot constructed, go ahead and create the table layout with all the text pre-typed in the appropriate cell(s). Now go to the HTML view ("View", "HTML...") and go to the table you just created. It should be quite obvious which table it is because it should have all the data you inputted. Just before the <TABLE> tag, insert the tag <FORM>. Now look for the point where your table ends and insert the tag </FORM> after the </TABLE> tag.

We are assuming that you don’t know how to implement CGI or PERL scripts at this point so we’ll have the form’s "action" attribute link to your e-mail address. Do this by inserting the ACTION="mailto:youremailaddress" attribute inside your <FORM> tag. Also be sure to insert the METHOD="POST" attribute in the same tag or your form won’t send. It might also be worth suggesting to name your forms in the case you receive multiple forms (use the NAME="yourformname" attribute. Example: <FORM NAME="Feedback" METHOD="POST" ACTION="mailto:info@pcmachines.com">

At the end of your form, you’ll want to place a "Submit" button to allow the user to transfer applicable form data to your e-mail address. Simply do this by inserting the following code at the end of your form: <INPUT TYPE="submit" NAME="Submit" VALUE="Submit">.

Also worth mentioning is the fact that you’ll want to name your form fields so that form data may easily be identified at the time you review a specific user’s input. In every form field, insert the name="anyspecification" attribute. Example: <INPUT TYPE="checkbox" NAME="yes"> would identify the user’s choice for a field as "yes". Place the "VALUE" attribute if you want a field already pre-typed. This is helpful for fields such as "country" where it is typically more likely to find that user is from the United States so you would place VALUE="United States" for that tag. And if someone’s from Canada (or any other country) they can just simply erase what’s in the form field and type in their own country.

Unfortunately, special characters will be encrypted with this process but is normal. For this reason, many advanced programmers choose to program complex CGI or PERL scripts that allow the form data to send directly and unencrypted to a specified e-mail address where it can be easily interpreted when viewed. This book assumes you’re not an advanced CGI or PERL programmer so we’re just letting you in on the basic approach for having form data sent to your e-mail address.

To decipher a specific special character, simply refer to our table below. These are commonly used punctuations.

%21 ! %60 ` %3F ?
%22 " %2B + %5B [
%23 # %2C , %5C \
%24 $ %2F / %5D ]
%25 % %3A : %5E ^
%26 & %3B ; %7B {
%27 ‘ %3C < %7C |
%28 ( %3D = %7D }
%29 ) %3E > %7E ~

Punctuations that don’t have a coded equivalent include the following:

@ the "at" symbol * the asterisk
-  the dash mark _ the underscore
.  the period

Occasionally, you might get a raw "ASCII based e-mail message containing a file called "postdata.att" of an unspecified type (application/octet-stream). The e-mail subject line will typically state "Form posted from Microsoft Internet Explorer" so you know the file came from someone using the Internet Explorer browser, if that means anything to you. Since this file type is not associated with any common application (and that it’s resident e-mail specifically states that the encoding is "7bit"), you’ll have to open it using either Microsoft Notepad or Microsoft WordPad (which can both be initialized by going to "Start", "Programs" and "Accessories"). Simply use the program’s "Open" command from the "File" menu and select the option "All Files (*.*)" in the "Files of type" field for Notepad or the option "All Documents (*.*)" for WordPad and browse until you find the file in the directory you saved the "postdata.att" file in. From this point, its just a matter of copy and pasting the file’s contents (if worthy enough) to your manual guestbook or other file if you chose to save it.

Side Note: If you have access to a cgi-bin (the folder that typically stores files of type ".pl" and ".cgi") please feel free and give a shot setting up some scripts. The scripts at Matt’s Script Archive (http://www.worldwidemart.com/scripts) are fairly easy to set-up for beginners. Simply follow the instructions to configure them and set permissions and you have an opportunity for creating a potentially advanced (and interactive) site. And, if you make use of the "formmail.pl" script, you can forget about taking all the time deciphering your e-mail form input. With this method, you can also be guaranteed to have the form data sent to you rather than have it sent via the e-mail method where its possible that your user might not have their e-mail program set-up. (And if they don’t have their e-mail program set-up, they can’t send the form input to you since the default method is based on e-mail delivery.) The "formmail.pl" script also gives you the option to set-up a thank you page that appears when the user clicks the "Submit" button. (Hey, it’s a lot better than clicking the Submit button and having the appearance of nothing processing.) Generally speaking, with the user of CGI scripts, you won’t have to worry about what’s supported with what browser and so on. If you had used JavaScript interactivity, for instance, you would have had to do research to see if your specific effect would work for the majority of Internet surfers. Contact your system administrator to see if you have access to a cgi-bin. Many Web hosting providers allow their customers to install their own scripts. You might also want to check out The CGI Resource Index at http://cgi.resourceindex.com/Programs_and_Scripts/Perl/ for more CGI/PERL scripts to work with. This site has an extensive library of many popular scripts on the World Wide Web. An in-depth discussion of implementing CGI and PERL scripts to your Web directory may be found in the "Installing CGI/PERL Scripts" section.

________________________________________________________

  ©1999-2012 Curtis Carmichael.   All rights reserved worldwide.