The basic properties name, width and hidden are available for all form elements.

Alias

When a form is submitted, the entered data is transmitted as key value pairs (element name   value. The name must contain only letters and number. You can use the name of an element as form variables during workflow processing to refer to the transmitted values. The name is also used when sending the submitted data to other system via an interface. Sometimes, when you need to integrate external third-party system into FORMCYCLE, the external system may require a particular name for a form field, which may include special character. In this case, you can use the alias name, which allows all special characters to be entered.

When an alias was set, you can use that alias instead of the orignal name to refer to the form field.

Renaming form elements

If form elements are simply renamed, parts of the JavaScript or form workflow may no longer work correctly because they reference the form element by its name. By clicking on the pencil icon   next to the form element name, the form element can be renamed, updating all references to the form element at the same time. You can select where to search for references to the form element:

• in the JavaScript area of the form
• in the CSS area of the form
• in JavaScript form files
• in CSS form files
• in the workflow of the form
• for elements on the property "Value"
• for elements on the property "Buttons"
• for elements on the property "Options"

If a reference is found in the selected areas, it will be updated with the new name.

You need to pay special attention to JavaScript code. Common ways of referencing a form element are taken care of. The name in usual selectors such as $('[name="tfEmail"]') is replaced with the new name. However, uncommon selectors such as document.getElementByName("tfEmail") are not replaced.

Moreover, please note that it is not possible, even in principle, to replace all references in a complex programming language such as JavaScript. For example, the name may be be taken from a variable, from a computation or from an external data source: ["EMail", "Vorname", "Nachname"].forEach(name => $(`[name="tf${name}"]`).clear()). Such cases require you to adjust the JavaScript manually. If you have forms with complex JavaScript code, you should always evaluate the effects of renaming a form element beforehand.

The properties available here are used to configure the visibility of the form element. The basic property Hidden is available to each form element. The properties Disabled and Repeat as well as the properties dependent on them are only available for form element types where they are useful.

This property defines the label text of an element. A label is the text above, below or to the right or left of an element. Not every element has got this property.

The constraints panel contains options to check the value of form fields, when form fields should be visible and when they can be edited. Some constraints are available only for some element, see the list of element..

Properties

Condition

You can change a form field's visibility and read-only state depending on the value of another form element.

7.2.0+ You can also choose formula, which lets you enter a custom formular with your own logic. That formula may reference more than one form element. Please note the following:

• The formular must be a valid JavaScript expression, e.g. $("[name='tfFirstName']").val() === "John".
  • JavaScript statements cannot be used, e.g. var x = $("[name='tfFirstName']").val() ; x === "John" will not work.
  • If still necessary, you can wrap statements in an IIFE (immediately invoked function expression): (function(){var x = $("[name='tfFirstName']").val() ; return x === "John"})()
• You can use form variables to access form values more easily. The variable is replaced with a JavaScript value container the value of the form element. For example: [%tfFirstName%]==="John"
  • If the value represents a valid floating point number, the placeholder is replaced with a JavaScript number value, e.g.: [%tf1%]+[%tf2%] < 10 (Sum of both fields < 10). Otherwise, the value is replaced with a JavaScript string, e.g.: [%tf1%].toUpperCase() === "JOHN" (Field equals "John", case insensitive).
  • The value depends on the type of form element:
    • For checkboxes, the value when checked is used, as entered in the form designer (default: on).
    • For input fields and text areas, the value as entered by the user is used.
    • For select elements displayed as combo boxes or list boxes, the technical value of the selected option is used.
    • For select elements displayed as checkboxes or radio buttons, the sum of all technical values of all selected options is used. This applies to select elements displayed as questions as well.
    • For upload elements, the file name of the selected fle is used.
    • For appointment pickers, the date and time as shown by the appoinment picker is used.
• You can also use other variables such as system variables: e.g. [%$PROJECT_TITLE%] === "My form".
• NO server validation is performed for custom formulas, even if that option is enabled for a form element.

Once you have selected a form element, the following conditions are available for the options hidden if, visible if, read-only if, editable if, and required if:

• has a value
• has no value
• equals
• not equals
• lower than
• lower equal than
• greater than
• greater equal than
• between
• regular expression

Clear or reset automatically

For the properties hidden if and read-only if, you may choose whether the form field should be cleared or reset automatically when the form field ist hidden or disabled. Clearing a form field means that its value is removed, eg. deleting the entered text for an input field or unchecking all checkboxes for a select field. Resetting a form field, on the other hand, refers to changing its value back to the original or initial value it had when the form was openend. In case the form was opened for the first time and not submitted yet, the original value is the value as set in the Xima® Formcycle Designer. Otherwise, when the form was already submitted and is opened in the inbox, the original value is the most recently submitted (saved) value.

For example, consider the case of entering an address. The user can choose between a physical address and a post-office box, and only one input field is visible depending on the user's choice. When the form is submitted, a value should be send only for one of both fields. By selecting the empty automatically options, the input field post-office box will be cleared automatically when the user selects a physical address.

When an element is cleared or reset, all the elements it contains are cleared or reset as well. This applies to form elements of type page, container, and fieldset.

This feature allows you to add an explanation or help text to a form element. By default, the help text is empty. Once you enter a help text, you will see a help icon   appear next to the form element. When the user hovers over the help icon with the mouse, the help text is shown as an overlay. 

To change the design of the help icon or the overlay bubble, create your own CSS theme.