This background is for all administrators and page designers.

Overview: Each form will have three "pages" associated with it.  Forms are used to collect information and pass it to a specific person.  Any administrator can create a form.  To create a form three pages are needed.  First there is the hidden "Thank You" page  which will be displayed when the form is completed successfully.  Write down the PID of this page  This page can be shared between several forms.  Second is the hidden page which contains the form element in the top content area. Third is the visible page which contains both text about the form (e.g., instructions on how to fill out the form, what the various fields mean) and the |pContent.:##| tag.  The ## is the PIDID of the second page (i.e., the actual form element).  It is possible for several pages to use the same form with instructions tailored to the visitors of that page. These pages can also be pop up pages.  Remember any page author can use any form element so created.  The can be found listed under the "Show Special" link along with their PID.  The author who uses the form will add the explanation of the form's purpose is included their page.   The "Admin" user enables various system users to receive forms, but the individual form design determines who will receive a specific form.  Since, the system can be configured to require authentication before showing a page, you can limit who can fill out a specific form.  Forms do support secured information.  Click here to see the form input section. 

Basic steps to building a form:

  1. Build the "thank you" page
  2. Build the form on a hidden page
  3. Build page(s) which will contain the form

Go to top

Types of Forms, an introduction.

  • The simplest form has a single pre-defined recipient, a sender's email address and one or more blanks for information to be filled in by the visitor.  When it is filled out, the system converts the information entered into an email and sends it, on behalf of the visitor, to the designated recipient.  This form can support the attachment of multiple files.
  • If you select Process as Secure Message then the recipient will receive a simple notification email and have to visit the Content Management System to read the results of the form.   The information is stored encrypted on the server.  Only the designated recipient or the 'Admin' user can read, print and optionally delete this information.  Warnings: Files cannot be uploaded on secure messages. The Admin user is responsible for updating recipient for any forms which are configured to a Email User which is then deleted.
  • The receiver can be any user defined in the CMS including ones who are Email Only (i.e., they can only receive emails).

Go to top

Selecting who will receive the form information  Use the drop down box "Email Receiver" to determine the recipient. 

Go to top

Common Form Elements (see the diagram above)

  • Required Elements:
    • The Email Receiver:  The user name and the actual configured email address.
    • Subject: this is the subject of the email that will be sent when the form is filled out.
    • The Thank you page PID: The machine assigned of the page which will be displayed when the system determines that the page has been filled out correctly.  If the page does not exist then a Page Not found error will be displayed after the form is filled out.  This page will normally be hidden and should be built before the form is designed.  Any page using this form will end up at this page when the form is completed. 
  • Up to 30 additional elements can be requested (this number can be increased if needed).   The resulting form will be build using DIV tags (see the list below for details).
    • Use the check box under the REQuired column to designate those fields which must be filled in.  This will also cause an '*' to be added after the name in the generated form.
    • Use the EMAIL radio button to designate which of the element will contain the visitor's email address.  This element will always be required and will have special validation performed against it.
    • Input type can be: a Text string, a Drop Down List, a file Upload, or a Text Area.  A special Note type is available to insert comment lines.  
    • Input Name will be used to identify the specific input field on the form as well as the email that is generated. (e.g, School Name, Your Email Address, Your Phone). All letters, numbers, apostrophe, open end close parentheses, dollar sign, comma and period are allowed.
    • The Drop Down type created a list to specify the Code and the words which appear in the drop down in the form code1=visible text1;code2=visible text2.
      • For example to encode the Input Type drop down you would enter:
        T=Text;A=Text Area;N=Note;D=Drop Down;H=Headline.  All letters, numbers, apostrophe, open end close parentheses, dollar sign, comma and period are allowed.
      • The code is what is passed in the generated message and the text is what is displayed in the drop down.
    • The Note type puts whatever is in the Input Name column in the first column of the form table and whatever is entered into the Values field in the second column.  All letters, numbers, apostrophe, open end close parentheses, dollar sign, comma, dash and period are allowed in either field.
      • Any text in the Input Name column is surrounded by a DIV tag pair with a style="aform_left_small".
      • Any text in the Value column is surrounded by a DIV tag pair with a style="aform_right_small". 
    • The Headline type can put out up to two different full width lines of text.
      • It puts whatever is in the Input Name column across both columns surrounded by a DIV tag pair with a style="aform_head1".
      • It puts whatever is in the Value column across both columns surrounded by a DIV tag pair with a style="aform_normal".
  • The system will always add a special graphic and text box at the bottom of the form to perform a "Captcha" test to block hostile bots from filling out the form.  It is the equivalent of the |.CaptchaBit.| tag. Captcha comes from "Completely automated public Turing test to tell computers and people apart"   Please see this Wikipedia article for background.

Go to top

Reading Secure Messages

  • The recipient  will receive an email notification of any new messages which the server is storing.  Note: this could be a special "mail only" user created for this purpose.
  • When you log in an envelope icon envelope icon will be displayed if there are any messages on the server (read or on read) to which you have access.  
  • Click on the icon and view your messages.  Click on the print button on the resulting page if you need it.
  • The user 'Admin' will see everyone's messages.

Go to top

Required Styles

  • Revised Form Styles  (replaced old formField, formInput styles (see below))  (Names on left and form input boxes on the right). Forms,  will use this format.
    • id=aform_box: used in 'DIV' tag which surrounds entire form. width: 560px plus any margins (e.g, #aform_box{width: 640px; background: #dedede; padding-left: 15px;})
    • class=aform_right used in 'DIV' tag which surrounds the right column element which contains the actual input element (e.g., #aform_right { float: right; width: 70%;})
    • class=aform_left used in 'DIV' tag which surrounds the left column element which contains the visible text input (e.g., #aform_left {float: left; width: 28%;})
    • class=aform_center used in 'DIV' tag which surrounds non-headline informational element which spans both columns (e.g., #aform_center { text-align: center; width: 98% })
    • class=aform_clear used in 'DIV' tag which is automatically inserted before the other divisions to ensure beginning of new form row (e.g., #aform_clear { clear: both; }This is REQUIRED or IE will get confused. 
    • class=aform_small_left used in 'DIV' tag which appears in left column of form for Note. (e.g., #aform_small_left {float: left; width: 28%; font-size: 72%; })
    • class=aform_small_right used in 'DIV' tag which appears in right column of form for Note. (e.g.,  #aform_small_right {float: right; width: 70%; font-size: 72%;})
    • class=aform_head1 used in 'DIV' tag for Headline text which appears across both columns (e.g., #aform_head1 { height: 42px; width: 95%; padding-top: 45px; font-family: Arial, Helvetica, sans-serif;
      font-size: 20px; font-weight: lighter; color: #003C59; margin-bottom: 15px; float: left; })
    • class=aform_normal used in 'DIV' tag for normal text which appears across both columns (e.g., #aform_normal { float: left; font-size: 80%; })