NetForms 2.5 User's Guide

Updating Pages: The GuestBook Example


The GuestBook example demonstrates the use of two important NetForms features. The <INSERTFILE> directive is used to update an existing HTML document, and the <IF> command is used to conditionally replace data from fields in the new HTML. It is also a good example of taking data from a user entry and rendering it as highly formatted HTML with IF commands to prevent the creation of broken or malformed links.

The GuestBook consists of three files- AddGuest.html, the HTML form where guests enter information; AddGuest.FDML, which processes the forms and adds the new HTML to the third file, GuestBook.html. The GuestBook.html file is the actual guest book.

The default GuestBook.html file, with no entries, is very simple:

  <HTML>
  <TITLE>Sample GuestBook</TITLE>
  <BODY>
  Here is a registry of the people who have visited my site...
  Why not <A HREF="AddGuest.html">add yourself</A>?
  <HR>
  <!--GUESTLIST-->
  </DL>
  </BODY>
  </HTML>

The unique feature of the file is the "<!--GUESTLIST-->" comment tag near the end. This comment serves a marker where NetForms will insert new HTML into the document.

The entry form in AddGuest.html looks fairly long here, but is otherwise straightforward.

  1)  <HTML>
  2)  <TITLE>Add Yourself To The GuestBook</TITLE>
  3)  <H1>Add Yourself To The GuestBook</H1>
  4)  <FORM method=POST action= "/NetForms.acgi$/GuestBook/AddGuest.FDML">
  5)  To be added to the GuestBook, just fill out this form...
  6)  <P>
  7)  <HR>
  8)  <H3>About You...</H3>
  9)  <DL>
  10) <DD><B>Name:</B> <INPUT TYPE="text" NAME="UserName" SIZE="32" MAXLENGTH="32">
  11) <P>
  12) <DD><B>E-Mail:</B> <INPUT TYPE="text" NAME="EMail" SIZE="32" MAXLENGTH="32">
  13) <P>
  14) <DD><B>Title:</B> <INPUT TYPE="text" NAME="Title" SIZE="32" MAXLENGTH="32">
  15) <P>
  16) <DD><B>Organization:</B> <INPUT TYPE="text" NAME="Company" SIZE="32" MAXLENGTH="80">
  17) <P>
  18) <DD><B>Home Page URL:</B> <INPUT TYPE="text" NAME="HomePageURL" SIZE="32" MAXLENGTH="80">
  19) <P>
  20) </DL>
  21) <HR>
  22) <H3>About Your Web Site...</H3>
  23) <DL>
  24) <DD><B>Site Name:</B> <INPUT TYPE="text" NAME="SiteName" SIZE="32" MAXLENGTH="40">
  25) <P>
  26) <DD><B>Main URL:</B> <INPUT TYPE="text" NAME="MainURL" SIZE="32" MAXLENGTH="32">
  27) <P>
  28) <DD><B>Brief Description:</B>
  29) <BR> <INPUT TYPE="text" NAME="Desc1" SIZE="60" MAXLENGTH="60">
  30) <BR> <INPUT TYPE="text" NAME="Desc2" SIZE="60" MAXLENGTH="60">
  31) </DL>
  32) <P><HR><P>
  33) <CENTER>
  34) <INPUT TYPE=submit VALUE="Add Yourself">
  35) </CENTER>
  36) <P>
  37) </FORM>
  38) </HTML>

The form defines a number of fields for the user's name, e-mail address, company, URL, company URL, and other interesting information.

This comes together in the AddGuest.FDML where the raw information is put into formatted HTML. It is a relatively short file, but a lot happens in ten lines.

  1) <RESPONSE>"/GuestBook/GuestBook.html"</RESPONSE>
  2) <INSERTFILE "<!--GUESTLIST-->"> "/GuestBook/GuestBook.html"</INSERTFILE>
  3) <P>
  4) <IF HomePageURL # "" THEN "<A HREF=""<REPLACE HomePageURL>"">"><B><REPLACE UserName></B><IF HomePageURL # "" THEN "</A>">
  5) <IF EMail # "" THEN "(<REPLACE EMail>)"> - <REPLACE Title><IF Title # "" THEN ", "><REPLACE Company><P>
  6) <DL>
  7) <DD><IF MainURL # "" THEN "<A HREF=""<REPLACE MainURL>"">"><B><REPLACE SiteName></B><IF MainURL # "" THEN "</A>">
  8) <IF Desc1 # "" THEN " - <REPLACE Desc1> <REPLACE Desc2>">
  9) </DL>
  10) <HR>

So, what's going to happen here after the user clicks the Submit button?

Line 1 - The <RESPONSE> directive is used in the other examples, but in this case note that the response file is the same GuestBook.html file that NetForms is updating!

Line 2 - The <INSERTFILE> directive contains the "<!--GUESTLIST-->" marker to indicate where NetForms should insert the new HTML. In between the two tags is the path and filename for the GuestBook.html file where the new HTML will be inserted.

Note that the Response directive comes before the Insertfile. This is because everything after the Insertfile will be part of the HTML that is inserted. If the Response directive were after the Insertfile, it would be inserted into the guest book entry along with the user information!

Line 4 - This line conditionally creates a link to the user's home page. If the user did not enter a home page URL, the IF commands will prevent NetForms from creating a broken link.

Note that this requires two IF statements- one for the first part of the anchor tag, with "<A HREF=" and the URL of the user's home page, and another for the closing "</A>" from the anchor tag.

The IF commands are easier to understand if you look at each part separately:

  <IF HomePageURL # ""

Each IF command uses the # character for "not equal to". This is a common technique to check for empty fields in the user's input, so the snippet above has the logic "If the field HomePageURL is not empty". The rest of the IF command inserts the URL into the HREF part of an anchor tag.

  THEN "<A HREF=""<REPLACE HomePageURL>"">">

The second part of the IF command actually has a <REPLACE> command inside it. By putting the <REPLACE> inside the IF command, the replacement may not be made depending on the IF command. This works because NetForms executes all of the <IF> commands first, then goes through and executes the <REPLACE> commands. You can also use this technique to create very complex forums by conditionally executing <RESPONSE> or <CHAIN> directives.

Line 5 - The next line uses similar IF commands to insert the user's e-mail address only if they have entered something into the "EMail" field and the user's company name if they have entered a title.

Line 6 - The <DL> tag will format the next few lines as a definition list so they will be nicely indented.

Line 7 - This line starts out with a <DD> tag to indent the HTML. Here is yet another IF command to create a link to the user's company Web site only if they have entered the URL for one.

Line 8 - This assumes that if the user didn't enter anything on the first description line, they probably didn't enter anything on the second either. If there is something on the first description line, it inserts both.

Lines 9-10 - These two close the definition list and then insert a horizontal rule to separate the new entry from the existing ones.


[ Examples Menu Page | Table Of Contents ]

Copyright © 1996-8 Maxum Development Corporation
820 South Bartlett Road - Suite 104
Streamwood, IL 60107
http://www.maxum.com/