I'm working on implementing multi-entity lookup from the SLDS examples https://www.lightningdesignsystem.com/components/lookups/#Multi-Entity
I'm trying to capture the user's input in the aura component controller.
Full Component:
<aura:component >
<aura:attribute name="isexpandedLookup" type="boolean" default="false" />
<div class="slds-combobox_container slds-combobox-addon_end">
<label style="height:18px;" class="slds-form-element__label"><span class="" ></span></label>
<div class="{!'slds-combobox slds-dropdown-trigger slds-dropdown-trigger_click' + (v.isexpandedLookup ? ' slds-is-open' : '')}" id="primary-combobox-id-1">
<div class="slds-combobox__form-element slds-input-has-icon slds-input-has-icon_right" onclick="{!c.changeStateLookup}" role="none">
<input variant="label:hidden" type="text" label="" aura:id="combobox-id-1" class="slds-input slds-combobox__input" id="combobox-id-1" aria-autocomplete="list" aria-controls="listbox-id-1" aria-expanded="{!v.isexpandedLookup}" aria-haspopup="listbox" autoComplete="off" role="combobox" placeholder="Search..." onkeyup="{!c.handleKeyUp}" />
</div>
</div>
</div>
</aura:component>
Controller:
({
handleKeyUp : function(cmp, evt, helper){
console.log(cmp.find('combobox-id-1').get('v.value'));
}
})
it works when I use a Lightning:input like this
<lightning:input variant="label:hidden" type="text" label="" aura:id="combobox-id-1" class="slds-input slds-combobox__input" id="combobox-id-1" aria-autocomplete="list" aria-controls="listbox-id-1" aria-expanded="{!v.isexpandedLookup}" aria-haspopup="listbox" autoComplete="off" role="combobox" placeholder="Search..." onkeyup="{!c.handleKeyUp}" />
But if I use a plain input, it doesn't
<input variant="label:hidden" type="text" label="" aura:id="combobox-id-1" class="slds-input slds-combobox__input" id="combobox-id-1" aria-autocomplete="list" aria-controls="listbox-id-1" aria-expanded="{!v.isexpandedLookup}" aria-haspopup="listbox" autoComplete="off" role="combobox" placeholder="Search..." onkeyup="{!c.handleKeyUp}" />
get('v.value') returns undefined
How can you retrieve the input value when using standard input tags?