Lightning ui:InputText details

Akshay Jain

May 30, 2017·1 min read

This post is primarily directed towards Salesforce Lightning Development

We have ui input component as

<ui:inputText aura:id=”searchInput” label=”Search” keyup=”{!c.performSearch}”/>

and following function
performSearch: function(component, event, helper) {
var searchInput = component.find(“searchInput”);
var searchValue = searchInput.get(“v.value”);
}

now, if you type “ABCD” in the rendered html input of above component, then function performSearch will be called 4 times owing to keyup event, but the var searchValue will contain undefined, because v.value is not updated on keyup, its updated on ‘change’ event by default

Change event is fired when focus goes out of the input box

in order to make v.value update on key up modify above component as follows

<ui:inputText aura:id=”searchInput”
label=”Search”
keyup=”{!c.performSearch}”
updateOn=”keyup” />

References

http://peterknolle.com/lightning-input-component-value-binding/
https://youtu.be/NOe1WOB2ERE?t=1m12s