6

I'm aware that it's still beta, but I didn't expect them to break it for older api versions :/

<aura:application extends="force:slds">
    <aura:attribute name="myNumber" type="Decimal" default="1" />

    <lightning:input type="number" label="Number" value="{!v.myNumber}"/>
    <ui:inputNumber value="{!v.myNumber}" />
</aura:application>

This simple my.app works in spring'18 orgs, but doesn't in summer'18, using the newest Firefox 60.0.1 (Mac & PC). No matter if you switch to api version 41, 42 or 43.

The number is not changeable in the lightning:input field. The behavior is super super weird! If you start inspecting it with the Firefox inspector, it starts working. If you right click it, it might also work, when the value is empty.

It seems to be related to the fact, that something in the background switches the type of the input field to number, but it gets switched back to text. As soon as you can make it stick to number, it works as expected:

<input ... type="text">
to
<input ... type="number">

Is anyone out there aware of a way to quick-fix this?

Update:

After submitting a case, they created an issue for this, feel free to mark yourself as affected:

lightning:input type="number" is not editable in Firefox

1

There is a bug with lightning: input. When attribute value change in the background, the same value is not reflected back on the UI component.

It only takes the attribute value when it is initialized for the first time, that being said, the option we have now is to re-create lightning:input everytime you want to update new value.

This can be handled by using aura:if and valueChange event.

aura:if evaluates the isTrue expression on the server and instantiates components in either its body or else attribute. Only one branch is created and rendered. Switching condition unrenders and destroys the current branch and generates the other

<aura:application extends="force:slds">
    <aura:attribute name="myNumber" type="Decimal" default="1" />
    <aura:attribute type="Boolean" name="showLightningInputField" default="true"/>

    <aura:handler name="change" value="{!v.showLightningInputField}" action="{!c.recreateField}"/>


    <aura:if isTrue="{!v.showLightningInputField}">
       <lightning:input type="number" label="Number" value="{!v.myNumber}"/>
    </aura:if>

    <ui:inputNumber value="{!v.myNumber}" change="{!c.makeBooleanAsFalse}"/>
</aura:application>

JS:

({
    makeBooleanAsFalse : function(component, event, helper) {
        component.set("v.showLightningInputField",false);
    },

    recreateField : function(component, event, helper) {
        component.set("v.showLightningInputField",true);
    }
})

If you have a Premium account or you have an MVP in contact you can raise a CASE to ask them to fix this issue.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/aura_compref_aura_if.htm

EDIT: Surprisingly in my other Summer 18 org this is not reproducible. They fixed it I guess. It is on Summer '18 Patch 6.1.

  • Dear downvoter, it would help if you provided a reason for your downvote. – Pranay Jaiswal May 30 '18 at 8:03
  • Sure, I am a teammate of the guy who asked and your answer simply doesn't apply to anything he asks. Did you really check his code? Why are you talking about aura:if? There is no patch yet... It's noise. The more of those verbose but unhelpful answers we have on SFSE the less value it provides. – Robert Sösemann May 30 '18 at 9:13
  • Hi @RobertSösemann, the question asked a way to quickfix this,. which I provided with best of my knowledge. The solution works, I still dont think it provides less value. – Pranay Jaiswal May 30 '18 at 9:18
  • @Pranay Jaiswal Can confirm that this is still an issue on Patch 7.5. sigh. – Nic Jun 3 '18 at 0:42
  • @Nic On our case they said: The patch 214.8 will be released on 6/5/2018 3:00 PM PST (Safe harbor) – Basti Jun 5 '18 at 7:37
0

Update:

The Issue states it is fixed, for some reasons they did not mark the instances as fixed, but I can confirm, that it is fixed for us and our customers since a couple days.

Known Issue: lightning:input type="number" is not editable in Firefox

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.