Field error state
FieldError puts a field in an error state. The border and the label of the field get the danger color, and an error Callout next to the field says what is wrong. Use it for a required field that is empty, or for a value that is not valid. It works with each Unity field and each toolbox field.
How to mark a required field:
saveButton.clicked += () =>
{
if (string.IsNullOrWhiteSpace(nameField.value))
{
FieldError.Show(nameField, "Enter a user name.");
return;
}
FieldError.Clear(nameField);
save();
};
How to remove the error when the user types:
nameField.RegisterValueChangedCallback(_ => FieldError.Clear(nameField));
How to show the error state with no callout (for example, when a label below the form has the message):
FieldError.Show(mailField);
In a Wizard, give the field to ShowValidationError. The wizard sets and clears the error state for you:
wizard.GetStep("user").Validator = _ =>
{
if (nameField.value.Length > 0) return true;
wizard.ShowValidationError("Enter a user name.", nameField);
return false;
};
| Member | Description |
|---|---|
FieldError.Show(field, message, placement) |
Gives the field the error state. With a message, it also opens an error callout next to the field. The default placement is CalloutPlacement.Right. A second call replaces the message. |
FieldError.Clear(field) |
Removes the error state and closes the callout. |
FieldError.Has(field) |
True while the field has the error state. |
FieldError.CalloutOf(field) |
The open error callout of the field, or null. Use it to change the callout, for example its TipSize. |
- The error state stays until
Clear. A value change does not remove it. - The callout follows the field, and it closes when the field leaves the panel, for example when its window closes. Escape closes a callout only when it has the focus; a callout with only text does not take the focus.
- The callout moves to the opposite side when the workspace has no room.
Showwith a message needs a field that is in a panel.
Styling
| Class | Element |
|---|---|
tb-field--error |
The field in the error state. The package rules set border-color of its unity-base-field__input and color of its unity-base-field__label to --tb-color-danger. |
tb-callout--error |
The callout. See Callout. |