Skip to main content

ValueWarnController

Purpose

Show a warning message when the user provided value of a numeric input (<input type="number"/>) exceeds the given bounds.

Actions

ActionPurpose
--

Targets

TargetPurposeDefault
inputThe <input> whose value will be tested-
warningThe place where the warning(s) will be output-

Classes

ClassPurposeDefault
inputWarning (Optional)The class(es) to apply to the inputTarget when the value of the input goes over/under the given thresholds-
warningHide (Optional)The class used to hide the warningTarget when there are no errorshide

Values

ValueTypeDescriptionDefault
min (Optional)NumberThe minimum value that inputValue can have-
minMessage (Optional)StringThe warning text to show in warningTarget when the value of inputTarget exceeds the minimum valueValue must be less than ${minValue}
max (Optional)NumberThe maximum value that inputValue can have-
maxMessage (Optional)StringThe warning text to show in warningTarget when the value of inputTarget exceeds the maximum valueValue must be greater than ${maxValue}

Events

EventWhenDispatched onevent.detail
----

Side Effects

The controller will add an event listener for input to the input target.

How to Use