You need to sign in to do that
Don't have an account?
Andrew Aldis 15
Get the value from a HTML select element in a lighting component
I am trying to get the value from a HTML select element in a Lighting Component, I need to user select because I am unable to correctly style a lighting:select component. I need to get the value of the component when it is changed, but cannot seem to get it the sameway I would if it was a lightning component. Any help is appreciated.
Lighting Component
<div aura:id="header" class="header">
<div class='titleInput'>
REGION:
<select name="select" label="" aura:id='select' class="select" onchange="{!c.changeRegion}">
<aura:iteration items="{!v.regions}" var="regions">
<option text="{!regions}"></option>
</aura:iteration>
</select>
- SALES AND REDEMPTIONS
</div>
Component.Js
changeRegion: function(component, event, helper) {
console.log('onchange called 1 ');
var inputRegion = component.find('select').get('v.value');
console.log(inputRegion);
//helper.getRegionalSalesRedemptions(component);
},
Lighting Component
<div aura:id="header" class="header">
<div class='titleInput'>
REGION:
<select name="select" label="" aura:id='select' class="select" onchange="{!c.changeRegion}">
<aura:iteration items="{!v.regions}" var="regions">
<option text="{!regions}"></option>
</aura:iteration>
</select>
- SALES AND REDEMPTIONS
</div>
Component.Js
changeRegion: function(component, event, helper) {
console.log('onchange called 1 ');
var inputRegion = component.find('select').get('v.value');
console.log(inputRegion);
//helper.getRegionalSalesRedemptions(component);
},
OR
use
All Answers
I trust you are doing very well.
Try this:
Or you can use id instead of aura:id as you are using HTML select tag.
And in JS, use:
I hope it helps you.
Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in future.
Thanks and Regards,
Khan Anas
OR
use