Versions Compared

Key

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

palette offers a rich variety of controls that let you create virtually any form. All controls provide functionality as soon as you able

drop them into your form but need
Section
Column
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

...

The Date/Time control relies on the timezone of the browser. The time portion will be calculated based on the date and whether or not Daylight Savings Time is observed in that time zone.

The Date control is used to denote a day and has no dependencies on time zone.

For example, A time of 5:00 PM is entered into a Time control and a date of 2/5/2014 plus 5:00 PM into a Date/Time control by a user located in the America/New_York (Eastern Standard Time). When the submission is viewed in the EST time zone, the Time Control displays 5:00 PM. This value will not change. The time portion of the Date/Time control also displays 5:00 PM, because it takes on the timezone of the browser (EST) and it is not further adjusted because Daylight Savings Time is not observed in EST on February 5th.

...

Requires users to enter a valid EMail address. The address must conform to the following syntax: <name>@<name>.<string>. Email addresses with apostrophes and longer domain names are allowed.

Email validation follows the OWASP recommendation. It validates that there is

  • at least one '@' character
  • the local-part is not greater than 64 characters
  • the domain is not longer than 255 characters.

Money

Allows users to enter U.S. currency. Users may type commas and a decimal point but will not add them to the data automatically. The form also will round all entries to two decimal places. For example, if the user enters 4000, it will display as 4000.00 when the user exits the field.

...

ComboBox

The ComboBox control to support supports three types of data retrieval: frevvoUsers, frevvoRoles and Web Service. The source for the options is selected from the Options Src property. Selecting Web Service makes it possible to Information about how to set up Options for the ComboBox control is discussed under the Dynamic Options feature topic.

You can use the Combobox to retrieve values from a database and enable a list of possible partial matches. 

LDAP customers often use the ComboBox control if they 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. The ComboBox control allows users to type characters in the ComboBox control that filter the choices to the entered characters and display those that match. You can also type a value that is not in the list. Notice this control is not in the list.

Image Added

Drag/drop the ComboBox from the Palette or import it from schema. When you dnd the ComboBox from the Palette, it does not have a Control Type property so you . You cannot change the ComboBox to a different control by changing the value in the Control Type dropdown. You must delete the ComboBox and then add the control that you want.  

Existing forms/flows that contain the ComboBox control will have the value of the Options URL property in the Options Src field after upgrading.

Info
  1. The Combobox control will not work for public forms as the call to find users and roles is secured.
  2. The ComboBox control will not work in Edit mode. Click the Image Added save and test icon to verify your changes.
  3. The maximum number of items returned from a query is 1000 when using the ComboBox control in a form/flow if your tenant is using the LDAP Security Manager. This is an LDAP limitation.
  4. The maximum number of items returned from a query is 1000 when using the ComboBox control in a form/flow if your tenant is using the Azure SAML Security Manager.

 

ComboBox from Schema

combobox now works from schema. It does not have a display as property when from schema (nor a control type property when from palette). As part of this, re-organized control types internally to place combobox with the text type controls because it does not have options like the other select types controls and is not a type of SelectControl?.

ComboBox from Schema

You can change the Options Src for Combobox controls that are added to your form/flow when you upload a schemaNotice this control does not have a Control Type display as property so you cannot change the ComboBox to a different control by changing the value in the Control Type dropdown. You must delete the ComboBox and then add the control that you want. the appearance of the control using this property.

Image Added

Information about how to set up Options for the ComboBox control is discussed under the Dynamic Options feature topic.

Radio

This adds mutually exclusive radio buttons. You define the number of radio buttons and the specific choices by editing the control’s Options properties. Note: If you select a radio option as the default and later decide you do not want an option selected by default, you must remove that option from the control and tab out of the options property so that it is removed from the control. Then add the option back to the control's option list. Now that option is no longer a selected default.

...

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.

...

Max size is the upper limit for each attachment uploaded to your forms/flow. The internal upper limit is controlled by a configuration parameter - frevvo.attachment.maxsize. In the  cloud. It is set to 10 mbMb. If you enter a value into the control's max attachment size property greater than  internal upper limit, you will see an error message displayed on the upload control.

...

Message Control in a Table

Whwn When you drop a Message Control in a Table, the rich text editor is rendered much smaller when you click on it,. This is illustrated below. Notice that none of the rich text editor's menus are displayed.

...

The Rich Text editor will be vertically expanded when you show the menus in Message Controls or any group control that you drop a Message control into that is less than 4 columns wide. 

Message Control in a Repeat

You can drag and drop a Message control from the palette into a repeat or into a section that then gets dropped into a repeat. You can write Rules affecting the Message controls in repeats. Message controls in Repeats can contain templates. Repeat controls containing Message controls can be converted to Tables. Refer to the Control Type property for the details. 
 

Horizontal Layout using the Message Control

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

 

One approach would be to use the Table and Radio Controls.  Another alternative is to use three Message controls and three Radio controls. Follow these steps: 

  1. Drag and drop a Panel onto the designer canvas.  
  2. Drop Message controls into the panel for the user instruction and the labels Fellowship announcements, Conferences and workshops and Other major news and events. Select None in the Message Control Type field.
  3. Click on the Style tab. Set the width of the Message Controls to half the size of the panel.
  4. Place 3 Radio controls with Yes/No options to the right of the Message Controls for the 3 choices. Check the Hide Label property for each.
    1. Click the Style tab and enter 50% in the Item Width property
  5. You may have to insert a single line break HTML tag in the Message property to align the Message Control text with the Yes/No options of the Radio Control.

    Image Modified

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

...

Link Control (for URLs)

Use the Link Control when you want to include a URL in your form. When users click the link, the button text is underlined and the target URL will open in a separate browser window. The Link control has a default button color and is automatically decorated. You cannot remove the decorator or change the button color. Unlike most controls, the default width of the control, when dragged from the palette and dropped into your form is 3 columns. Click here for more information. The New Line  property is checked by default. 

...

The message informs the designer what the configured limits are so they can take corrective action.

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 a single line break HTML tag - <br/>.. 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.

Trigger Control

The trigger control adds a button to your form and is used in conjunction with rules. If your form does not have rules you will not need the trigger control. If your form does have rules, see Triggers & DynamicOptions for details on how to use trigger controls and examples of when you might want to use them.

...

Code Block
<center>Click on the <img src="/frevvo/images/icons/add.gif"/> icon to add addmoremore phone numbers to the list.<br/></center>

...

  • You may drag in only one control, and you may not drag in tab controls, panels or other repeat controls. 
  • You may not drag in trigger, image, video, link, upload, tab, table or signature controls. 

...

Mobile forms work best when they are broken up into small, logical pieces. The PageBreak control lets the designer create a mobile layout consisting of multiple pages where each page contains a small number of controls (logical groupings). The user navigates between the pages via Back/Next buttons, or on a device that supports it, by swiping left/right.

Tablet and Smartphone forms  

Forms are generated using HTML5 controls so features like Custom Keyboards, Date pickers etc. can be used. For example:

...

The PageBreak control cannot be dropped BELOW any control. It can be dropped BETWEEN 2 controls or ABOVE any control. For example, say you had a form with two panels side by side and you wanted to drop a PageBreak control in between them. Drag the PageBreak control from the palette to the left of the second panel in the form until you see the  up arrow as shown in the image below:

Drop the control when you see the Image Modified green up arrow and the PageBreak control will drop between the two panels.


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.

...