I am tryin to handle field validation for a lightning:input field in a custom aura component. I've referenced the validating fields documentation with no success. I find my lightning:input component in my JS controller, pull it's value, but when i try to conditionally set the error message, I get an error:
Uncaught Action Failed... [Cannot read property 'config' of undefined]"
Here's my component markup:
<aura:component controller="cntrler" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" description="desc" access="global" >
<aura:handler name="init" value="{!this}" action="{!c.init}" />
<aura:attribute name="savedSearchSelected" type="Boolean" default="true" description="Tracks whether the user is filtering a saved search or performing a new search" />
<aura:renderIf isTrue="{!v.savedSearchSelected == false}">
<div class="slds-size_1-of-1">
<div class="slds-m-around_x-small">
<lightning:input name="search-name" value="{!v.savedSearchName}" placeholder="Name your search, if you'd like" aura:id="search-name"/>
</div>
</div>
</aura:renderIf>
</aura:component>
Javascript Controller
({
saveSearch : function(component, event, helper) {
var input = component.find('search-name');
var searchName = input.get('v.value')
console.log(input, searchName);
if(helper.isEmpty(searchName)){
console.log('empty name');
//input.set('v.errors',[{message:'Please name your search before saving'}]);
} else {
//input.set('v.errors', null);
}
}
})
The input.set() lines in the controller are what's causing the error. Why am I not able to use this component.set() method when I am successfully retrieving the component (as shown by my console.log and even the .get value from that component in the line prior)
Best Answer
Based on your comments, the issue is on the line where you are setting the error on your
lightning:input
component as:in this case the error you are receiving is the expected behavior.
var input = component.find('search-name');
will return alightning:input
component. And that alightning:input
component does not have a propertyerrors
which can be set here thus resulting in error.The
errors
attribute was/is only present forui:input
as mentioned in Validating Fields documentation. The documentation also states thatui
namespace is being deprecated with API v46.0.So, if you want to set an error message on the
lightning:input
component, you will need to usesetCustomValidity()
here as below:Take a look at the Custom Validity Error Messages section in the
lightning:input
documentation for details.