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.
-
<HTML>
<TITLE>Add
Yourself To The GuestBook</TITLE>
<H1>Add
Yourself To The GuestBook</H1>
<FORM
method=POST action=
"/NetForms.acgi$/GuestBook/AddGuest.FDML">
To be added to
the GuestBook, just fill out this form...
<P>
<HR>
<H3>About
You...</H3>
<DL>
<DD><B>Name:</B>
<INPUT TYPE="text" NAME="UserName" SIZE="32"
MAXLENGTH="32">
<P>
<DD><B>E-Mail:</B>
<INPUT TYPE="text" NAME="EMail" SIZE="32"
MAXLENGTH="32">
<P>
<DD><B>Title:</B>
<INPUT TYPE="text" NAME="Title" SIZE="32"
MAXLENGTH="32">
<P>
<DD><B>Organization:</B>
<INPUT TYPE="text" NAME="Company" SIZE="32"
MAXLENGTH="80">
<P>
<DD><B>Home
Page URL:</B> <INPUT TYPE="text"
NAME="HomePageURL" SIZE="32"
MAXLENGTH="80">
<P>
</DL>
<HR>
<H3>About
Your Web Site...</H3>
<DL>
<DD><B>Site
Name:</B> <INPUT TYPE="text" NAME="SiteName"
SIZE="32" MAXLENGTH="40">
<P>
<DD><B>Main
URL:</B> <INPUT TYPE="text" NAME="MainURL"
SIZE="32" MAXLENGTH="32">
<P>
<DD><B>Brief
Description:</B>
<BR>
<INPUT TYPE="text" NAME="Desc1" SIZE="60"
MAXLENGTH="60">
<BR>
<INPUT TYPE="text" NAME="Desc2" SIZE="60"
MAXLENGTH="60">
</DL>
<P><HR><P>
<CENTER>
<INPUT
TYPE=submit VALUE="Add Yourself">
</CENTER>
<P>
</FORM>
</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.
- <RESPONSE>"/GuestBook/GuestBook.html"</RESPONSE>
- <INSERTFILE
"<!--GUESTLIST-->">
"/GuestBook/GuestBook.html"</INSERTFILE>
- <P>
- <IF
HomePageURL # "" THEN "<A HREF=""<REPLACE
HomePageURL>"">"><B><REPLACE
UserName></B><IF HomePageURL # "" THEN
"</A>">
- <IF EMail #
"" THEN "(<REPLACE EMail>)"> - <REPLACE
Title><IF Title # "" THEN ", "><REPLACE
Company><P>
- <DL>
- <DD>
- <IF MainURL
# "" THEN "<A HREF=""<REPLACE
MainURL>"">"><B><REPLACE
SiteName></B>
- <IF MainURL
# "" THEN "</A>"><IF Desc1 # "" THEN " -
<REPLACE Desc1> <REPLACE
Desc2>">
- </DL>
<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.
|