2

Aura Init:

<aura:attribute name="DTValue" type="String" default="{!'2019-03-06T10:17:36.789Z'}"/>
<aura:attribute type="DateTime" name="selectedActionDate" default="{!v.DTValue}"/>

Input Fields in component

<lightning:input type="date" onchange="{!c.onChangeInput}" value="dummyText" name="dummyText"/>

<lightning:input type="datetime-local" label="DateTime" value="{!v.selectedActionDate}" name="selectedActionDate"/>

Javascript

onChangeInput: function(component, event, helper) {
    //Trying to set value on change.
    component.set('v.selectedActionDate', '2016-05-04T11:23:00.000Z');
    //Trying to refresh view
    $A.get('e.force:refreshView').fire();
}

enter image description here

When i change 'dummyText' text value then onchange event will be triggered from javascript, so that new date time need to set for {!v.selectedActionDate}, but its not happening in new ligthing UI datetime picker in summer18.

After changing the {!v.selectedActionDate}, ligthing dateTime input is not showing new value.

Let me know the your need more clarity.

2

There is a bug with lightning:input for datetime-local. When attribute value change, 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 been 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:attribute name="DTValue" type="String" default="{!'2019-03-06T10:17:36.789Z'}"/>
    <aura:attribute type="DateTime" name="selectedActionDate" default="{!v.DTValue}"/>
    <aura:attribute type="Boolean" name="showDateTimeField" default="true"/>

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



    <lightning:input type="text" onchange="{!c.onChangeInput}" value="dummyText" name="dummyText"/>




    <aura:if isTrue="{!v.showDateTimeField}">
        <lightning:input type="datetime-local" label="DateTime" value="{!v.selectedActionDate}" name="selectedActionDate"/>
    </aura:if>
    <br></br>

    {!v.selectedActionDate}

JS controller:

 onChangeInput: function(component, event, helper) {
        //Trying to set value on change.
        //
        console.log(component.get("v.selectedActionDate"));
       component.set('v.selectedActionDate', '2016-05-04T11:23:00.000Z');

        console.log('on change called');
        component.set('v.showDateTimeField',false);

        //Trying to refresh view
        //$A.get('e.force:refreshView').fire();
    },

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

Logic: 1)In onChangeInput method I am setting showDateTimeField as false, this will destroy the content inside aura:if thus that datetime componen will be destroyed.

2) I have added a listener on showDateTimeField, which will make it as true when it changes, thus it will recreate the content inside aura:if and you will have new instance of lightning:input for datetime with updated values.

That been said, why are you trying to store text in lightning:input for date? that is just making yourself more prone to errors.

lightning:input is still in beta, thus it can have few bugs. If you have premium support you can raise a case with SF to let them know and they can fix it before Summer 18 goes live.

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

  • Good and Thanks for quick answer. @Pranay Jaiswal I have given string for initializing some random date, yes your question make sense, Line updated <aura:attribute name="DTValue" type="DateTime" default="{!'2019-03-06T10:17:36.789Z'}"/> – Shiva May 22 '18 at 7:04
  • 1
    It would work still.. Independent of datatype – Pranay Jaiswal May 22 '18 at 7:07

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.