Skip to main content

         This documentation site is for previous versions. Visit our new documentation site for current releases.      

Using conditional logic in Cosmos React

Updated on October 17, 2022
Applicable to Cosmos React applications

Define the logic that governs the behavior of fields in your application more intuitively with the condition builder. By creating conditions, you can link the visibility and availability of certain parts of your UI to your business needs, and build a cleaner, less cluttered application.

For example, in a loan application, you can disable fields that collect information about a spouse if the customer is single.

  1. In App Studio, navigate to a condition builder that defines the application logic that you want to edit.
    For example: In an Edit field dialog box, set the Disabled list to Custom condition, and then click the Settings icon.
  2. In the Condition builder dialog box, in the Select field list, choose the field on which you want to base your comparison.
    For example: Select Marital status.
  3. In the middle field, select the expression that you want to use in your comparison.
    For example: Select is equal to.
  4. Click the Settings icon to select the type of value to which you want to compare the field:
    • To compare the selected field with free-form text, select Enter text.
    • To compare the selected field with a field in the application, select Another field.
    For example: Select Enter text.
  5. In the last field, define the value against which you want to compare the target field.
    For example: Enter Single. The application can now evaluate the Marital status field. If the expression is true (Marital status equals Single), the field is disabled.
  6. Optional: To add another row to the condition, define its components and relation to other rows:
    1. Click the Add a row icon, and then repeat steps 2 through 5.
    2. Click the and operator and define the logical relation between the conditions.
      If you select and, the condition evaluates to true when all of the rows evaluate to true. If you select or, the condition evaluates to true if at least one of the rows evaluates to true.
  7. Optional: To define complex relations between rows, click Advanced mode, and then, in the Advanced condition field, define the logic that you want to use.
    For example: Enter (1 OR 2) AND 3. For a condition that has three rows, this expression evaluates to true if either the first or the second row evaluate to true, and at the same time, the third row is also true.
  8. In the Condition builder dialog box, click Submit.
For example:
Sample logic in a condition builder
Condition builder fields illustrating the example of marital status evaluating equal to true when the user input is Single.

Have a question? Get answers now.

Visit the Support Center to ask questions, engage in discussions, share ideas, and help others.

Did you find this content helpful?

Want to help us improve this content?

We'd prefer it if you saw us at our best. is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us