How to use Basic Components

There are 8 Basic Component parts: text or number field, text area, check box or selected boxes, radio buttons, HTML element or Content part.

Basic Components


  1. Set your cursor on the ‘_Text Field’ in Basic components, click and drag it to form editor field and just drop it. The ‘Text Field Component’ window appeared. You can define the values of the fields on the right side, and follow your work in the ‘Preview’ section on the left.

    • "Display", please fill the listed fields.

      In the Label you should cite the name of the field.
      The Placeholder field contains text which will appear if the field stays empty (could be used as description of the field and it is visible until text is entered).
      The Description part appears below the inputted field (in this part you can write explanation for inputted field).
      If you want to predefine a format of inputted field, you can manage it with the Input Mask field. Define whether content of field would be alphabetical, numeric or alphanumeric (using a 9 or *).
      With the Prefix and Suffix fields you can define text which will appear before and after a field.

      Aditional checkboxes:

      a) Multiple Values - Allows multiple values to be entered in the field.
      b) Clear Value When Hidden - Clears value of the field if the field is hidden (checked automatically)
      c) Disabled - Disables form input
      d) Printable - The element appears in exported PDF, marked by default (checked automatically).

      Text field component display
    • In "Data" - Default value you can add a value to the field, that should define the field prior to any user interaction.

      Text field component Data
    • In "Validation" part you can set if filling this field should be obligatory or not. By this you can make sure that the form cannot be submitted before filling the given input field. In this part you can also define the minimum and the maximum length requirement fields must meet, and test if the field value could pass before the form can be submitted in Regular Expression Pattern.

      text field component validation
    • In "Layout" part you can set margin values.

      Text field component layout
    • The "Conditional" field. Mark this box if you want the field to appear only if a certain, given condition (content or value) is met in another field.

      Text field component conditional


After defining the desirable values for the Text field component, click the "Save" button and the Text field will appear in the form editor part. Please note: it is not obligatory to define values for all sections.

  1. The "#number" Basic Component
    For handling the Subcomponents follow the instructions as given above. (Basic components #1)
  2. The "Text Area" Component.
    • In "Display" if you Enable WYSIWYG by marking the checkbox, you will get options for formating text.
    For the rest of Subcomponents: Follow the instructions as given above. (Basic components #1)
  3. "Check box" Component
    • In Display section fill the Label field and select the Input Type (Checkbox or Radio button).
      Note the differences: The Checkbox type can be marked and unmarked, the Radio button cannot be unmarked once it is marked.

      Additional checkboxes:
      a) DataGrid Label - Shows the label when in a DataGrid (checked automatically)
    For the rest of the Subcomponents: Follow the instructions as given above. (Basic components #1)
  4. "Select Boxes" Component

    Let user choose a value from a pre defined list.
    • In "Display" section define the Label which will appear next to the field and add predefined list below by clicking on "Add Value" button.
    Aditional checkboxes:
    • Inline Layout – pre-defined list appears vertically by default, but if you want the boxes to be displayed horizontally, mark this checkbox.
    For the rest of the Subcomponents: Follow the instructions as given above. (Basic components #1)
  5. A "Radio" button component is an element that allows the user to choose only one of a pre-defined set of mutually exclusive options. The singular property of a radio button makes it distinct from a checkbox, which allows more than one (or no) item to be selected.

    For handling the Subcomponents: Follow the instructions as given above. (Basic components #1)
  6. "HTML Element" Component for using HTML Tags in custom forms.
    • In ‘Display’ part of the window it is enabled to add HTML tags and define their attributes with values and to add content of that HTML element.

    It is set by default that this element will appear when export your form to PDF, but if you don’t want to, just uncheck ‘Printable’ checkbox.

    For the rest of the Subcomponents: Follow the instructions as given above. (Basic components #1)
  7. ‘Content’ Component.
    It is displayed as text box where text can be entered and formated.