Challenge: Applying Multi-triggers

Using the project at the end of this lesson, perform the tasks highlighted in the problem statement section.

Problem statement

The project at the end of this lesson represents a form that allows the user to enter their full name and age. Currently, when the user selects any text box, the box will become red. Also, when the text in both text boxes is empty, the submit button is disabled. The challenge consists of the following tasks:

• Modifying multi-trigger logic.

• Modifying the highlighting behavior.

Modifying multi-trigger logic

You need to make changes to the application. First, the age field is optional, so empty text in it should never disable the button. The name field is compulsory, so having it empty should always disable the button.

Modifying the highlighting behavior

The highlighting behavior needs to change too. Only the mandatory name text box should be highlighted when in focus and only when it's empty.

This is how the app behavior should differ if we have some text in the name field and no text in the age field: