Text Area

The Text Area is a multi-line input field element in Joget, allowing users to type in more extensive information than a standard Text Field.

How does it work?

To see how the Text Area works, follow these steps using the built-in App Expenses Claims:

  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 the + button for Create New Form and fill up the Form Details as follows:
    • Form ID: textArea
    • Form Name: Text Area
    • Table Name: j_expense_claim


  4. Drag and drop a Text Area element onto the canvas.
  5. Click the Text Area element on the canvas to open the Configure Text Area properties.
  6. Fill up the Configure Text Area properties as follows and click Apply Change:
    • Label: Justification
    • ID: justification
  7. Click Preview to see the Text Area in action.

Configure text area

Configuring the Text Area involves setting the label, ID, and other advanced options to customize its behavior.

Here is an explanation of each field in the Text Area element:

  • Label: Element label to be displayed to the end-user.
  • ID: Element ID. A corresponding database table column c_justification will be created by declaring it as justification. See Form Element for more information about defining the ID and list of reserved IDs.

Advanced options

Advanced options for the Text Area element provide additional settings to customize its functionality and behavior further. These settings include data management, UI customization, and workflow integration, ensuring the Text Area meets specific requirements and enhances the overall user experience.

Data

Data settings for the Text Area element include defining its default value and applying validation rules.

Configure the following fields:

  • 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#
    Markup

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

  • Validator: Attach a Validator plugin to validate the input value.
    When will validation take place?
    Validation will occur whenever a form is submitted except when it is submitted as Save as Draft.
    Available options include:
    • Basic
    • BeanShell
    • Date and Time Duplicate Validator
    • Directory
    • Duplicate Value
    • Equal Value
    • Multi Form Validator
    • Password
    • Plugin Template - Validator
  • Sanitize Input Value?: Checking the box will sanitize the input value before storing the input data in the database. See Form Input Sanitization.

UI

UI settings for the Text Area element help customize its appearance and behaviour.

Configure the following fields:

  • Placeholder: The placeholder attribute specifies a short hint describing the input field's expected value (e.g., a sample value or a short description of the expected format). The short hint is displayed in the input field before the user enters a value.
  • Cols: Column size.
  • Rows: Row size.
  • Readonly: Determines if the element is editable.
  • Display Field as Label When Readonly?: Displays the value of the element as plain text when an element is set to Readonly.

Workflow

Workflow settings integrate the Text Area with workflow processes, allowing values to be saved and used within workflow variables.

  • 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
Created by Julieth Last modified by Aadrian on Dec 13, 2024