OpenText Forms 10.5.0 - Forms Designer's Guide English (LLESFRM100500-CWM-En-1)
OpenText Forms 10.5.0 - Forms Designer's Guide English (LLESFRM100500-CWM-En-1)
LLESFRM100500-CWM-EN-1
OpenText Forms
Forms Designer's Guide
LLESFRM100500-CWM-EN-1
Rev.: 2013-Nov-25
This documentation has been created for software version 10.5.
It is also valid for subsequent software versions as long as no new document version is shipped with the product or is
published at https://knowledge.opentext.com.
Open Text SA
Tel: 35 2 264566 1
Tel: +1-519-888-7111
Toll Free Canada/USA: 1-800-499-6544 International: +800-4996-5440
Fax: +1-519-888-0677
Email: [email protected]
FTP: ftp://ftp.opentext.com
For more information, visit http://www.opentext.com
Disclaimer
Every effort has been made to ensure the accuracy of the features and techniques presented in this publication. However,
Open Text Corporation and its affiliates accept no responsibility and offer no warranty whether expressed or implied, for the
accuracy of this publication.
Table of Contents
1 Introduction to Forms ............................................................... 5
1.1 Tutorial: A Personal Profile Form ........................................................ 6
OpenText Forms are electronic documents you can use to collect and store data
online. You can use the Forms module to make your organization's forms, such as
survey information and questionnaires available in Content Server. The OpenText
Forms module is an optional module in Content Server. When you create a Form in
Content Server, you base it on a Form Template that the administrator or other
designated user previously created. The Form derives its layout and design from the
template, but you can select processing and data-storage options for each individual
Form. The Forms Painter allows you to add Form fields in the same way that you
assign attributes to a document in Content Server. Form fields and their values are
stored in their own Content Server tables.
Notes
• The tutorial, “Using Forms in Workflows“ on page 17, assumes that you
are familiar with designing and using Workflows. If you are not familiar
with Workflows, consult the OpenText Workflow - QuickStart Guide
(LLESWFW-UQS) in the OpenText Knowledge Center (https://
knowledge.opentext.com/knowledge/cs.dll?func=ll&objId=18091763&
objAction=browse&sort=name&viewType=1) before beginning the tutorial.
• This guide assumes the optional Forms and Web Forms module are installed
in Content Server. If these module are not installed, contact your
administrator.
2. If you have installed the optional Adobe PDF Forms or eForms modules, you
are prompted to specify the Form type. Click the HTML radio button, and then
click Continue.
4. Click Add.
5. Click the Personal Profile Template name link to open the template.
6. Click the Add Attribute menu and build the Form Template by adding the
following fields:
7. Click Submit.
Once all the fields are in place, you must choose a Revision or Submission
mechanism (or both) for the Forms created using the template. For more information
about Revision and Submission mechanisms, see the OpenText Content Server User
Help - Using Forms (LLESFRM-H-UGD).
• Click Form on the Add Item menu of a Workspace, and then click Browse
Content Server to locate and select the template.
• Click the Functions icon, , of the Personal Profile Template item, and then
click Make Form.
3. Click Continue.
5. Click Add.
Note: You must install the optional Web Forms module in addition to the
Forms module before you can export a Form.
1. Click the Form Template's Functions icon, and then choose Export as HTML.
2. Click Save and then browse to the location where you want to store the file.
You can now open this file in an HTML editor and modify many of its features. You
can use any HTML editor to edit the HTML file, except for Microsoft Front Page
Express. Unlike the full version of Front Page, Front Page Express does not support
the use of square brackets in field names. These brackets are vital to a Form's
functionality in Content Server.
Note: Due to page size limitations, the code samples in this guide contain
line breaks that may prevent the button from working if you copy and
paste the code sample into your HTML file. If you copy and paste the code,
verify that it does not contain spaces or other characters before you save
your changes.
4. Repeat steps 2 – 3 for every attribute in the Form Template.
<BODY Class="pageBody">
<FORM NAME="myForm" ACTION="[LL_CGIPATH /]" ENCTYPE="multipart/
formdata" METHOD="POST">
<INPUT TYPE="HIDDEN" NAME="func" VALUE="[LL_FUNC /]">
<INPUT TYPE="HIDDEN" NAME="LL_FUNC_VALUES"
VALUE="[LL_FUNC_VALUES /]">
<INPUT TYPE="HIDDEN" NAME="LL_AttrFieldName" VALUE="">
<INPUT TYPE="HIDDEN" NAME="LL_AttrFieldIndex" VALUE="">
<TABLE BGCOLOR="#FFFFFF"
BACKGROUND="[LL_SUPPORTPATH /]pattern.gif"
CELLSPACING="0"CELLPADDING="0" WIDTH="100%">
6. Replace this code with the following:
<BODY Class="pageBody">
<FORM NAME="myForm" ACTION="[LL_CGIPATH /]" ENCTYPE="multipart/
formdata" METHOD="POST">
<INPUT TYPE="HIDDEN" NAME="func" VALUE="[LL_FUNC /]">
<INPUT TYPE="HIDDEN" NAME="LL_FUNC_VALUES"
VALUE="[LL_FUNC_VALUES /]">
<INPUT TYPE="HIDDEN" NAME="LL_AttrFieldName" VALUE="">
<INPUT TYPE="HIDDEN" NAME="LL_AttrFieldIndex" VALUE="">
<center>
<font FACE="Arial,Helvetica,sans-serif">
<h1>Personal Profile</h1></center>
<p>Fill out this Form to submit your Personal Profile. The fields
marked
<IMG SRC="/img/required.gif" ALT="Required" BORDER="0"> are
required fields.</p>
<p>When you are finished, click the <b>Submit This Form</b>
button.</p>
</font>
<TABLE BGCOLOR="#FFFFFF"
BACKGROUND="[LL_SUPPORTPATH /]pattern.gif"
CELLSPACING="0"CELLPADDING="0" WIDTH="100%">
Note: The path in the required field IMG tag, <IMG SRC="/
img/required.gif" ALT='Required' BORDER='0'>, depends on the
configuration of the computer used to generate the example. The name of
your Content Server support directory depends on the name selected by
the person who installed your instance of Content Server.
7. To change the caption on Apply to Submit This Form, locate the following area
of code:
1. Click the Functions icon of the template to which you want to add the custom
view, click Properties, and then click Views.
• Click Form on the Add Item menu of a Workspace, and then click Browse
Content Server to locate and select the template.
• Click the Functions menu of the Personal Profile Template, and then click
Make Form.
2. Choose a Revision or Submission mechanism (or both) for the Form from their
respective lists.
3. Click Continue.
6. Click Add.
7. Click the Personal Profile Form 1 name link to see the form. See Figure 1-1.
When Content Server exports a Form Template as HTML, it includes elements in the
HTML code that are necessary for the Form to function as a Content Server object.
Therefore, before you begin editing a Form exported as HTML, you should
understand what these elements are and be careful not to alter them improperly.
Note: You must install the Web Forms module in addition to the Forms
module before you can work with HTML Forms and complete the tasks
described in this chapter.
In Chapter One, you created a sample Form Template called Personal Profile and
exported it as an HTML file. If you open the raw exported file in a Web browser, you
will see a view similar to Figure 2-1.
As noted in Chapter One, you can use any HTML editor to edit the HTML file,
except for Microsoft Front Page Express. Unlike the full version of Front Page, Front
Page Express does not support the use of square brackets in field names.
As you can see in the HTML code of an exported Form, as well as in Figure 2-1,
Content Server uses brackets to assign values to the data entered in Form fields.
Immediately below the <BODY> tag are two lines of code that place two fields, func
and LL_FUNC_VALUES, on the Form.
Content Server assigns these fields TYPE="HIDDEN" therefore they do not display,
but both fields are required by Content Server so you should not alter them.
Toward the end of the HTML body section is some code that creates the Apply and
Reset buttons on the Form and includes code to handle the submission of the Form
in Content Server. You can edit the display name, which is found in the VALUE field.
The entry VALUE="Submit This Form" will appear in the applyButton line of code if
you made the changes detailed in “To edit the HTML of the Exported Form
Template:” on page 8. If you did not make this change, the value will read
VALUE="Apply". Open Text recommends that you do not edit any other field.
Throughout the HTML file are Form fields with the Content Server-specific values
LL_FormTag. These values tell Content Server what each field is and, therefore, how
to handle the data entered in it.
2.2.1 Read-Only
All Form Templates exported from Content Server invoke JavaScript, so you can
include JavaScript functions in your HTML customizations. To make a Form read-
only, you make use of three JavaScript functions:
• onFocus()
• onBlur()
• onChange()
In JavaScript, Focus refers to the object (in this case, the field) where the cursor is
blinking. Therefore, you can trigger an onFocus() event whenever the cursor enters
a particular field. Used in conjunction with this.blur(), an onFocus event causes
the cursor to immediately jump to the next field as soon as it enters the field you
want to protect. This effectively renders the field read-only:
The onChange() function tells Content Server that the data in the field has been
changed, even though it has not. This is necessary for the Form Template to function
properly when it is returned to the Content Server database as a view.
2.2.2 Hidden
You can hide some Form fields and other elements by changing its TYPE attribute to
hidden:
Content Server users often attach Forms to Workflows as a systematic way to gather
information. As a Form routes through the steps of a Workflow, it is often helpful to
use different views of a Form that are tailored to the particular step or to the
assigned user step.
Using Web Forms, you can create just one Form Template for use in such cases, and
then make multiple views of the Form to be used at the appropriate steps in the
Workflow. This chapter contains a tutorial that shows you how to set up an
Employment Application Form in Content Server that applicants can fill out and
save for later editing. Once the applicants are finished editing the Form, they can
submit the Form, thereby initiating a Workflow. The Workflow is first assigned to
the applicant where they can attach their resume and make any alterations to the
Form before submitting the application package to a manager for approval.
The following sections guide you through the steps that are necessary to create a
Employment Application Form.
• “Create the Employment Application Form Template” on page 18
• “Add an HTML Custom Form View” on page 18
• “Create a Form” on page 20
• “Create the Workflow” on page 20
7. Click Submit.
1. Open the exported HTML file in an HTML editor, and locate the section of code
pertaining to the Salary box:
<TR>
<TD CLASS="label" NOWRAP VALIGN="MIDDLE"> Salary:
</TD>
<TD NOWRAP>
<INPUT CLASS="valueEditable"
TYPE="hidden" NAME="_1_1_5_1" TITLE="Salary" ID="_1_1_5_1"
2. To prevent the Salary box from displaying, change its Input Type tag from
TYPE="text" to TYPE="hidden".
<TR>
<TD CLASS="label" NOWRAP VALIGN="MIDDLE"> Employer's
Comments:
</TD>
<TD NOWRAP>
<INPUT CLASS="valueEditable"
ID="_1_1_6_1" NAME="_1_1_6_1" TITLE="Employer's Comments"
WRAP="soft" ROWS="3" COLS="32"
ONFOCUS="" ONCHANGE="markDirty();">[LL_FormTag_1_1_6_1 /]>
</TD> </TR>
4. To prevent the Employer's Comments box from displaying, change this code to:
<TR>
<TD CLASS="label" NOWRAP VALIGN="MIDDLE"> Employer's
Comments:
</TD>
<TD NOWRAP>
<INPUT TYPE="hidden" ID="_1_1_6_1" NAME="_1_1_6_1"
VALUE="[LL_FormTag_1_1_6_1 /]"/></TD> </TR>
5. Locate the section of code pertaining to the Application Accepted check box:
<TR>
<TD CLASS="label" NOWRAP VALIGN="MIDDLE"> Application
Accepted:
</TD>
<TD NOWRAP>
<INPUT TYPE="CHECKBOX" NAME="_1_1_7_1" value="1"
ONCLICK="markDirty();">
</TD> </TR>
6. To prevent the Application Accepted check box from displaying, change this
code to:
<TR>
<TD CLASS="label" NOWRAP VALIGN="MIDDLE"> Application
Accepted:
</TD>
<TD NOWRAP>
<INPUT TYPE="hidden" ID="_1_1_7_1" NAME="_1_1_7_1"
VALUE="[LL_FormTag_1_1_7_1 /]"/></TD> </TR>
8. Now add the modified HTML file to the Employment Application Template as
a custom view as described in “Add an HTML Custom View” on page 10.
Name the view Public.
This procedure assumes that you are in the Workspace where the Form you created
earlier resides.
• Click Form on the Add Item menu of a Workspace, and then click Browse
Content Server to locate and select the template.
• Click the Functions icon of the Employment Application Template, and then
click Make Form.
3. Click Content Server Versions in the Submission Mechanism list. You will
change this value later.
4. Click Continue.
6. Click Add.
Note: The following sections assume that you are familiar with Content Server
Workflow features. If you are not familiar with the Workflow module, consult
the OpenText Workflow - QuickStart Guide (LLESWFW-UQS) in the OpenText
Knowledge Center (https://knowledge.opentext.com/knowledge/cs.dll?
func=ll&objId=18091763&objAction=browse&sort=name&viewType=1) before
beginning this part of the tutorial.
7. Click the Choose User or Group icon and click the Select link for the
Initiator.
8. Click Add to Workflow Definition and return to the Workflow Designer.
9. Drag and drop a User step to the right of the Attach Resume step and then link
the two steps.
10. Double click the User step and type Manager in the Step Name box.
11. Click the Choose User or Group icon and then navigate and select your
username.
12. Click Add to Workflow Definition and then return to the Workflow Designer.
13. Drag and drop an Evaluate step to the right of the Manager step and then link
the two steps.
Later, you will configure the Evaluate step to route the Workflow based on the
approved or rejected value in the Form.
14. Drag and drop a User step at 45 degrees to the Evaluate step, and then link the
two steps.
15. Double click the User step and type Approved in the Step Name box.
16. Click the Choose User or Group icon and then navigate and select your
username.
17. Click Add to Workflow Definition and then return to the Workflow Designer.
18. Drag and drop another User step at 325 degrees to the Evaluate step and then
link the two steps.
19. Double click the User step and type Rejected in the Step Name box.
20. Click the Choose User or Group icon and then navigate and select your
username.
21. Click Add to Workflow Definition.
22. Return to the Designer, and save the Workflow Map.
Note: For the Form inside the Workflow, it is important to select the same
template used on the Form that initiates the Workflow, so that the fields
match and data are passed to the appropriate steps.
7. Click Add Form.
This procedure assumes you are in the Employment Application Workflow Designer
region.
5. Click Submit.
6. In the Steps list, click Approved to indicate that the Workflow is routed to the
Approved step if the Application Accepted check box on the Form is selected.
See Figure 3-2 for details.
12. In the Steps list, click Rejected to indicate that the Workflow is routed to the
Rejected step if the Application Accepted check box on the Form is not selected.
See Figure 3-2 for details.
8. Repeat steps 2 – 6, except this time click <None> in the Form View list.
This allows managers to enter comments, a salary, and accept or reject the
application form.
1. Click the Functions icon for the Employment Application Form, click
Properties, and then click Specific.
4. Click Update.
5. In the Workflow Map area, click the Browse Content Server button, and then
select the Employment Application Workflow.
6. Click Update.
1. Click the Functions icon of the Employment Application Workflow and click
Edit.
Note: If your Workflow contains a Form Task step of a Form that does not use
a custom view, this procedure will display the Display Attachments button
automatically. If the Form Task step uses a Form that does use a custom view,
further editing to the custom view is required to display the Attachments
Folder.
For more information, see “Providing Access to the Workflow Attachment Folder
from a Custom View” on page 26. Regardless if the Form Task step uses a Form
with a custom view or not, the Display Attachments button on the Workflow
Forms page must be enabled.
The key to accessing the Attachments Folder from a custom view is using the
[LL_WFATTURL /] keyword in HTML and JavaScript code. Content Server replaces
the [LL_WFATTURL /] keyword in the custom view with a view of the Attachment
Folder.
Note: When adding the Display Attachments button or an HTML inline frame
to a Form within a Workflow, the Attachments package must be enabled in the
Workflow Map's General menu. If you do not enable the Attachments
package, the [LL_WFATTURL /] keyword is replaced by an empty string which
results in a separate browser window with no contents when the Display
Attachments button is clicked or an empty, unbordered area in the inline
frame.
1. Open the customized HTML form you created in “Add an HTML Custom Form
View” on page 18.
3. Add the Display Attachments button code on a line following the Reset button
code:
Note: Due to page size limitations, the code sample in this guide contains
line breaks that may prevent the button from working if you copy and
paste the code sample into your HTML file. If you copy and paste the
code, verify that it does not contain spaces or other characters before you
save your changes.
6. Click the Functions icon of the Employment Application Workflow and click
Edit.
4. Click Return.
8. Click Apply.
The attachment appears in the Attachments link of the Manager step. In the
Forms link of the Manager step, the Manager can enter an integer value in the
Salary box, enter comments in the Employer's Comments box, and determine if
they want to accept or reject the application by selecting or clearing the
Application Accepted check box. Once complete, the Manager clicks the Send
On button.
This procedure assumes that you are in the Workspace where the Form you created
earlier resides.
1. Open the customized HTML form you created in “Add an HTML Custom Form
View” on page 18.
2. Edit the exported HTML file, and locate the Form closing tag, </FORM>.
3. Add the following code on the line following the </FORM> tag:
6. Click the Functions icon of the Employment Application Workflow and click
Edit.
8. In the Form To Display area, click Inline Frame in the Custom View list.
11. Repeat the steps outlined in “Initiate the Workflow Using a Form” on page 28.
The Attachments Folder displays in the inline frame on the Form as seen in
Figure 3-4.
This chapter explains how to create and use a Form as a Stationery Pad.
Note: You cannot use a stationery pad if the revision mechanism is set to
<None>.
You control the stationery pad property for a Form on its Specific Info page. Only
users with Administer permission for the Form can configure it as a stationery pad.
After a Form is configured as a stationery pad, users with Edit Stationery Data
permission can modify the default data on a stationery pad.
When you select the Stationery Pad check box on the Form's Specific Info page and
click Update to convert a Form into a stationery pad, Content Server stores the
previously entered data with that stationery pad. Users can fill in additional data
and save the Form with a new name to an alternate location.
The following sections guide you through the steps required to create and use a
stationery pad.
• Click Form on the Add Item menu of a Workspace, and then click Browse
Content Server to locate and select the Employment Application Form
Template.
• Click the Functions menu of the Employment Application Template, and
then click Make Form.
1. In the location where you created the stationery pad, click the Employment
Application Stationery Pad link.
2. On the Edit: Employment Application Stationery Pad page, verify that the
default data is displayed.
3. Type Doe in the Last Name box.
4. Type John in the First Name box.
5. Click Apply.
6. On the Add Form page, type John Doe Application in the Name box.
7. Click Add.
Content Server creates a new Form based on the data you entered and the
default data in the stationery pad.