Set invalid message of text input field
Function: Set invalid message of text input field
This action allows you to display a specific error message next to a text input field on your application's screen. This is useful for guiding users when their input doesn't meet certain criteria, such as an incorrect email format, a password that's too short, or a missing required field.
Input
- UI element (PART): The specific text input field on your page where you want to show the error message. This field is required.
- Invalid message (STRING): The actual text of the error message you want to display. If you leave this field empty, any existing error message on the specified text input field will be cleared.
Output
This function does not produce any direct output. Its effect is visible on the user interface.
Execution Flow
Real-Life Examples
Example 1: Validating an Email Address Format
- Scenario: A user is filling out a registration form, and you want to ensure the email address they enter follows a standard format (e.g.,
[email protected]). If it doesn't, you want to show an error. - Inputs:
- UI element:
Email Address Input(This refers to the specific text input field on your form where the user types their email.) - Invalid message:
"Please enter a valid email address \(e.g., [email protected]\)"
- UI element:
- Result: If the user types "john.doe" into the "Email Address Input" field, this action will make the field display the message "Please enter a valid email address (e.g., [email protected])" below it, guiding the user to correct their input.
Example 2: Marking a Required Field as Missing
- Scenario: You have a contact form where the "Subject" field is mandatory. If a user tries to submit the form without filling in the subject, you need to alert them.
- Inputs:
- UI element:
Subject Input Field(The text input field for the message subject.) - Invalid message:
"This field is required to send your message."
- UI element:
- Result: When the user attempts to submit the form with an empty "Subject Input Field," this action will cause the field to display "This field is required to send your message." as an error.
Example 3: Clearing an Existing Error Message
- Scenario: A user previously entered an invalid password, and an error message was displayed. Now, they have corrected their password, and you want to remove the error message to indicate the input is now acceptable.
- Inputs:
- UI element:
Password Input Field(The text input field where the user enters their password.) - Invalid message: (Leave this field completely empty)
- UI element:
- Result: Any error message that was previously shown on the "Password Input Field" (e.g., "Password must be at least 8 characters") will be cleared, making the field appear valid again.