Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Section
Column

palette offers a rich variety of controls that let you create virtually any form. All controls provide functionality as soon as you drop them into your form but need to be customized (edited) to suit the form you are designing.

The purpose of each control is described below.

Column
width400px

On this page:

Table of Contents
maxLevel2

...

Input ControlXML Schema Type
Textxsd:string
Datexsd:date
EMail

types:emailType, an xsd:string restriction pattern defined in  types.xsd.

Moneytypes:number, an xsd:double restriction defined in types.xsd.
Phonetypes:phoneType,  an xsd:string restriction pattern defined in  types.xsd.
Quantityxsd:integer
Numbertypes:number, an xsd:double restriction defined in types.xsd.
T/Fxsd:boolean

The explanations below describe the controls generically—before you edit them to impose additional restrictions or define behavior specific to the form you’re creating.  

...

Note

You may notice that the Max Length property for the numeric controls: Number, Quantity and Money is no longer present in the v5 Forms designer. Uploading forms that were designed in v4.1.7+, with the Max Length set to a value, will not show this property in the v5 designer. However, the max length value will be honored when the form is executed in v5 use mode.

Selection Controls

 supports 4 5 types of Selection controls. Selection controls let users choose from a list of options instead of having to enter text.  

  • Dropdown
  • Radio
  • Checkbox
  • T/F
  • Combobox
Tip

See the Item Width property for styling options.

...

property for styling options.

Dropdown

This adds a dropdown list to your form. By default the first choice in the dropdown list will be blank; you define the other choices by editing the control’s Options properties. Keyboard selection of an option is not currently supported but is planned for a future release. Users can type-ahead. For example, select a dropdown control and type "S" and it jumps you to options that start with "S". This is extremely useful for dropdown controls that have a long list of options. This control is a standard HTML dropdown so it does not allow using backspace to clear selected options. The Comment property can be used to provide a text box for additional information when the last option in the selection control is chosen. 

...

LDAP customers may have many users/roles configured on their LDAP server. What if the designer wants to pull a list of users or roles from their LDAP server into a form or flow for user selection? Using a traditional dropdown control is not ideal especially when you have thousands of users to pick from. Dropdown control options are confined to a predefined list and maybe limited by the default max result size of an LDAP query. The Combobox control allows users to pick from a predefined list of values or type a value that is not in the list.

 The Combobox is used internally for functions such as creating the Access Control List.

...

Users can typeahead to narrow the choices based on the letters entered. User ids and roles are case sensitive so remember to use the correct case when typing.

The combobox supports the ability to specify single or multiple values. Simply check the single value checkbox if you want to limit the choice to one value.

Image Modified

Info
  1. It is recommended that designers drag and drop Combobox controls from the Palette only when adding this control to forms and flows. Adding a schema that contains a Combobox control as a data source for your form/low may produce unexpected results.
  2. The Combobox control will not work for public forms as the call to find users and roles is secured.

...

The control options default to "true=Yes" and "false=No". When you drag the control from the palette, only the "Yes" option will be visible. You can change the option labels from Yes and No to whatever you want. It is important to note changes to the label for false are irrelevant as it will never be visible on the form. The option values cannot be changed and will always stay as true and false. Blank labels for options are not allowedChecking the “Yes” checkbox of the Boolean control results in a true value in the XML document.

...

Notice the Required (false) property on the T/F Properties pane. This property is unchecked by default. If checked, the XML entry shows a false value even when the T/F value is not selected.

Image RemovedImage Added

 

A T/F control, added to a table, will hide the "Yes" option label. A Boolean checkbox should be used only if there are two states: Y/N. The column header label in the table can help make the choice obvious. For Example, you could create a column header - Non-Smoking Room in the table and if the user checks the box the value will be true and if the box remains unchecked, the value will be false.

...

You can specify the minimum and maximum number of attachments that can be uploaded to your form using the Min # and the Max # properties. Setting the min and max values to 0 or if the maximum # field is left empty means an unlimited number of files can be uploaded. Setting the min # to a value greater than zero makes the field required. Set the min # to 1 to ensure that the user uploads at least one attachment to your form. Use the max # for the maximum attachments allowed. Clicking on Add Files will not display the upload lightbox when the maximum # of attachments have been uploaded. No further uploads will be allowed. Setting the Max # to 1 disables the multi-select feature. See below for more information.

...

Dynamic Required vs Optional

It is not possible to make an upload control required dynamically in a business rule. This control does not have a required property on the Properties panel for the Upload control

...

. However, you can make the control required by setting the min # property greater than

...

0. If you need to make the Upload control required from a rule, you can put the upload control into a section, uncheck required on the section and then create a rule to make the

...

section required. Please see the documentation for controlling required vs optional for section controls.

Restricted Content Types and Other Mime/Ext

...

Let's say you wanted to modify a section of your form to reflect a horizontal layout as shown in the image.

 

One approach would be to use the Table and Radio Controls.  Another alternative is to use a Message control in conjunction with a Radio control to accomplish this. Follow these steps: 

  1.  Use a Message control for the labels Fellowship announcements, Conferences and workshops and Other major news and events

     Image Modified


  2. Place the Radio control with options to its right. 

     Image Modified


  3. Check the Hide Label property of the radio control. 

    Image Modified 


  4. Here is what the form looks like in Use mode: 

    Image Modified

You can use the Message control to center images uploaded to your form. Click here for the details.

...

Choose images that fit sensibly in your form before you upload it. The “regular” form size is 600px. You can resize an uploaded image by selecting the image control in the designer, clicking on the style tab in the properties panel and setting the width.

Centering Images using the Message Control

You can add a Message control on the left side of an image uploaded to your form to center the image. Replace the default text in the message control with one or more spaces. Change its Message Type to None. This will add a blank area on the left of that image and move it into the center. Click the Style tab if you need to modify the width of the message control.

Video Control

This lets you include video files in your form and works the same way as the image control. The control supports .SWF files and other video file formats that are supported by your browser. This control does not allow the designer to resize the video area. If your video is already hosted on another web service it is often best to embed your video into your form using a message control and adding the following html code to that control as shown below:

...

Use sections to create groups of controls that users can expand and collapse. Sections are always 12 columns wide when you drag/drop it from the palette and each is itself divided into 12 columns. Click here for more information.

Click the Image Removedicon Image Addedarrow to expand a collapsed section or Image Removed to Image Addedor to collapse an expanded section. When users access your form the section can be expanded or collapsed—it’s up to you. If you want the section collapsed initially, make sure it is collapsed when you save (finish) your form. You can   show/hide the section expand/collapse icon via a checkbox on the control style tab.

...

Let's try another example. You are designing a form for mobile devices. You drag and drop one control on the form. Now you want to add the PageBreak control and then add other controls below it. You cannot drop the PageBreak below any control so you will have to add the other controls first and then drop the PageBreak control where you want it. Once you add more than one control to the form, you can drop controls from the palette or the form above or below the page break. You can drag and drop the PageBreak itself anywhere at the root of the form. The PageBreak control should not be dropped inside sections, panels, tables or repeat group controls. The only exception is the Tab control. See below for the details.

...