Ask AI
Skip to main content

Set invalid message of input field

Function: Set invalid message of input field​

This action allows you to display a specific error message next to an input field on your form. This is useful for guiding users when they enter incorrect or missing information, helping them correct their input before submitting.

Input,

  • UI element: The specific input field on your form where you want to display the error message. This must be an input field component.
  • Invalid message: The text of the error message you want to show. For example, "This field is required" or "Please enter a valid email address." If you leave this blank, any existing error message on the selected input field will be removed.

Output,

The selected UI element on your form will display the specified invalid message next to it, or clear an existing message if no new message is provided.

Execution Flow,

Real-Life Examples,

Here are some common scenarios where you might use this action:

  • Example 1: Validating a Required Field Imagine you have a registration form, and the "Username" field is mandatory. If a user tries to submit the form without entering a username, you can use this action to prompt them.

    • Inputs:
      • UI element: Username Field
      • Invalid message: Please enter a username.
    • Result: The "Username Field" on the form will display the message "Please enter a username." next to it, indicating the error.

  • Example 2: Checking for Correct Email Format When a user enters an email address, you might want to ensure it follows a valid format (e.g., contains "@" and a domain). If the format is incorrect, you can provide specific feedback.

    • Inputs:
      • UI element: Email Address Field
      • Invalid message: Please enter a valid email address \(e.g., [email protected]\).
    • Result: If the user types "john.doe" into the "Email Address Field", the message "Please enter a valid email address (e.g., [email protected])." will appear.

  • Example 3: Clearing an Error Message After Correction After a user corrects an error, you'll want to remove the invalid message to show that the input is now acceptable.

    • Inputs:
      • UI element: Password Field
      • Invalid message: (Leave this field empty)
    • Result: Any existing error message previously displayed next to the "Password Field" will be removed, indicating the user's input is now valid.