Check Box

The Check Box is a generic HTML form input element in Joget's Form Builder. It allows users to define options through hardcoding or dynamically using an Options Data Store.

How does it work?

You can use the existing built-in App Expenses Claims to see how the Check Box works. Follow these steps:

1. Start the Joget Server and open the App Center.
2. Log in as admin and click the pencil icon on the Expenses Claim to open the App Composer.
   
3. Click Expense Claim New to be directed to the Form Builder.
   
4. Drag and drop a Check Box element onto the canvas.
5. Click the Check Box element to open up the Configure Check Box properties.
6. Fill in the Configure Check Box properties as follows and click Apply Change:
   
   • ID: type
   • Label: Type
   • Options Hardcoded:
     

     Value	Label
     Local	Local
     International	International

     
     
7. Click Preview to see that it works.
   
   

Configure check box

Configuring the Check Box involves setting labels, IDs, and options. These configurations ensure the Check Box is properly set up for user interaction and data management.

Fields to configure: 

• Label: Element label to be displayed to the end-user.
• ID: Element ID. A corresponding database table column c_type will be created by declaring it as type. See Form Element for more information about defining the ID and a list of reserved IDs.
• Options Hardcoded: Select Box options.
  Options defined here will not be used if an Options Data Store is defined below.
• Or Load Data From: Options to be populated dynamically using the Options Data Store plugin.

Advanced options

The Advanced Options section allows you to set default values, validators, and dependencies, enhancing the functionality and user experience of the Check Box.

Data

The Data section includes default values and validation settings to ensure the field is pre-populated and validated correctly.

Fields to configure:

• Default Value: 
  Default Value when there's no existing value found/selected.
  A Hash Variable is accepted here. For example, you may key the following:

  #currentUser.firstName# #currentUser.lastName#

  To pre-populate the field with currently logged in user's name.

  You may define multiple default options by separating them using semicolons.

  Sample
  option1;option2;option3
• Validator: Attach a Validator plugin to validate the input value.
  
  When will validation takes place?
  Validation will occur whenever a form is submitted except when it is submitted as Save as Draft.

Dependency

The Dependency section allows dynamic changes to the available options based on the value of another field.

Field to configure:

• Field ID to control available options based on Grouping: Dynamically change the available options based on the grouping attribute defined in the options by matching the current value of the element ID defined.

UI

The UI settings configure the display and editability of the Check Box element, ensuring it behaves as expected in different scenarios.

Fields to configure:

• Readonly: Determines if the element is editable.
• Display field as Label when readonly?: Displays the value of the element as plain text when the element is set to Readonly.

Workflow

Configure workflow-related properties for the Calculation Field to integrate with workflow processes.

Field to configure:

• Workflow Variable: If the form is part of a workflow process, upon saving the form by clicking Save as Draft or Complete, the value in this input field will be saved into the corresponding workflow variable named in this field.
  
  Using a non-existent Workflow Variable name
  You will get a warning with the name printed out (e.g., status) in the server log if you attempt to map to a non-existent Workflow Variable.
  

  context attribute status does not exist in process context - adding new attributes to the process context is not allowed

   
  
  
  .prop