I have a component that displays several different input types, such as ui:inputText
and ui:inputNumber
. Each input uses an change="{!c.handleChange}"
attribute.
In my controller, the handleChange
method then gets the value of the field. However, ui:inputNumber
fields aren't working. The sandbox I'm in was just updated to Winter 18 - so wondering if this has something to do with it.
Here's my component snippet:
<ui:inputText change="{!c.handleChange}" />
<ui:inputNumber change="{!c.handleChange}" />
And in my controller:
handleChange : function(component,event,helper){
// this works fine for all types except inputNumber
console.log(event.getSource().get('v.value'));
}
Using the above, ui:inputNumber
results in undefined. I've also tried the old event.target.value
, however event.target
is undefined.
Any thoughts?
EDIT: Adding entire component for context. I'm dynamically generating the inputs based on a Fieldset, this component get spun up for each input that needs to be displayed. It creates the input field based on the definitions passed to it.
Here's my component controller:
({
doInit : function(component, event, helper) {
// make the field component.
$A.createComponent(component.get('v.fieldDefinition'), component.get('v.fieldAttributes'),function(cmp,status,error){
if(component.get('v.fieldDefinition').startsWith('ui:')){
// need to add a handler for standard ui: components. custom components register them on their own.
cmp.addHandler('change',component, 'c.handleFieldUpdated');
// note: inputDate field does not support "onchange" events.
if(component.get('v.callbacks') != null){
for (var c in component.get('v.callbacks')){
var cb = component.get('v.callbacks')[c];
cmp.addHandler(c,component,cb);
}
}
}
component.set('v.cmp',cmp);
});
},
handleFieldUpdated : function(component,event,helper){
// event: FieldValueUpdated
var evt = component.getEvent("valueUpdated");
var val = event.getSource().get('v.value');
console.log(event.getSource());
console.log(val); // this is undefined for ui:inputNumber
evt.setParams({
fieldPath : component.get('v.fieldAttributes.fieldPath'),
value : val
});
evt.fire();
}
})
And here's the component:
<aura:component >
<aura:attribute name="cmp" type="Aura.Component" />
<aura:attribute name="fieldDefinition" type="string" />
<aura:attribute name="fieldAttributes" type="object" />
<aura:attribute name="callbacks" type="object" />
<aura:registerEvent name="valueUpdated" type="c:FieldValueUpdated" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
{!v.cmp}
</aura:component>
EDIT: I've opened a case with Salesforce support to see if they can resolve this issue. Case #17249103