Lightning component:
<aura:component>
<lightning:input aura:id="inputCmp" label="Enter your name:" name="fullName" />
<lightning:button label="Register" onclick="{! c.register }" />
</aura:component>
Controller:
({
register : function(component, event) {
var inputCmp = component.find("inputCmp");
var value = inputCmp.get("v.value");
// is input valid text?
if (value === "John Doe") {
inputCmp.setCustomValidity("John Doe is already registered");
} else {
inputCmp.setCustomValidity(""); // if there was a custom error before, reset it
}
inputCmp.reportValidity(); // Tells lightning:input to show the error right away without needing interaction
}
})
Three main seeded functions are used for the custom validation in input components.
- reportValidity
- setCustomValidity
- checkValidity
Reference Link:
No comments:
Post a Comment