+ Start a Discussion
Gopinath418Gopinath418 

DateTime field is always showing 12am in time slot in lightning

In lightning component I would like to map the DATETIME (custom) field with current datetime + 2hrs. I am mapping through apex code. The problem is that date is correctly mapped but the time is always showing 12 am. How can map time as well in lightning components
Best Answer chosen by Gopinath418
Ashif KhanAshif Khan
Hi Gopinath

I tried in my dev org it's working fine 
this is the sample code

Demo.app
<aura:application extends="force:slds" >
    <c:dateCmp/>
</aura:application>


dateCmp .cmp
<aura:component implements="force:lightningQuickAction,force:hasRecordId" controller='dateClassInt'> 
    <aura:handler name="init" action="{!c.init}" value="{!this}" />
    <aura:attribute name="today" type="DateTime" />
    
    <ui:inputDateTime aura:id="expdate" label="Expense Date" class="form-control"
                      value="{!v.today}" displayDatePicker="true" />
    
    
</aura:component>
({
    
      init : function(component, event, helper) {
        var action = component.get("c.fetchRequestedDate");  
        action.setCallback(this,function(a){ 
            var state = a.getState();
            if(state === "SUCCESS"){               
            
                 component.set("v.today", a.getReturnValue());   
          }
           });
        $A.enqueueAction(action);
          
          
    }

})

dateClassInt ​.apxc
public class dateClassInt {

    @AuraEnabled
    public static dateTime fetchRequestedDate()
    {
       Account aa=[SELECT Id, CreatedDate FROM Account order by CreatedDate ASC limit 1];
        
        return aa.CreatedDate; 
    }
    
}

Regards
Ashif
 

All Answers

Raj VakatiRaj Vakati
Can you share the code to see the issue ? Please refer this code to test 
 
<aura:component>
    <aura:handler name="init" action="{!c.init}" value="{!this}" />
    <aura:attribute name="today" type="DateTime" />
    <ui:inputDateTime aura:id="expdate" label="Expense Date" class="form-control"
                      value="{!v.today}" displayDatePicker="true" />
    
    
</aura:component>
 
({
    init : function(component, event, helper) {
        
        var today = new Date(); 
        // Convert the date to an ISO string
        component.set("v.today", today.toISOString());        
        
    }
})

 
Gopinath418Gopinath418
Hi Raj V,

fetchReqDate:function(component, event, helper){
        var action = component.get("c.fetchRequestedDate");  
        action.setCallback(this,function(a){ 
            var state = a.getState();
            if(state === "SUCCESS"){               
               console.log($A.localizationService.formatDate(a.getReturnValue(), "yyyy-MM-dd\'T\'HH:mm:ss.SSS a"));
               component.set("v.dateTimeattribute",$A.localizationService.formatDateTime(a.getReturnValue(), "yyyy-MM-dd\'T\'HH:mm:ss a"));
               var result = component.get("v.dateTimeattribute");
                component.set("v.newAcc.Requested_Date__c",result);               
                var result2 = component.get("v.newAcc.Requested_Date__c");                     
                var rec = component.get("v.newAcc");
          }

Apex Class Method
===============
@AuraEnabled
    public static string fetchRequestedDate()
    {
        string s=null;
        DateTime currentDate = DateTime.now();        
        s = currentDate.format('yyyy-MM-dd\'T\'HH:mm:ss.SSS a');
        return s;
    }

As you suggested i have tried to convert th Requested date into ISOstring but got an error " 

Thanks
Gopinath
Gopinath418Gopinath418
Hi Raj,

If we takes the current date from the component itself then i am not getting any error by using 'today.toISOString()' but if i am trying to get the current date from apex class then trying to convert it into ISOstring like component.get("dateTimeattribut").ISOString(); then i am getting error as " no function "component.get("dateTimeattribut").ISOString()".

I need to fetch the datetime from apex class and then i want disply it in Lightning component.

Thanks
Ashif KhanAshif Khan
Hi Gopinath

I tried in my dev org it's working fine 
this is the sample code

Demo.app
<aura:application extends="force:slds" >
    <c:dateCmp/>
</aura:application>


dateCmp .cmp
<aura:component implements="force:lightningQuickAction,force:hasRecordId" controller='dateClassInt'> 
    <aura:handler name="init" action="{!c.init}" value="{!this}" />
    <aura:attribute name="today" type="DateTime" />
    
    <ui:inputDateTime aura:id="expdate" label="Expense Date" class="form-control"
                      value="{!v.today}" displayDatePicker="true" />
    
    
</aura:component>
({
    
      init : function(component, event, helper) {
        var action = component.get("c.fetchRequestedDate");  
        action.setCallback(this,function(a){ 
            var state = a.getState();
            if(state === "SUCCESS"){               
            
                 component.set("v.today", a.getReturnValue());   
          }
           });
        $A.enqueueAction(action);
          
          
    }

})

dateClassInt ​.apxc
public class dateClassInt {

    @AuraEnabled
    public static dateTime fetchRequestedDate()
    {
       Account aa=[SELECT Id, CreatedDate FROM Account order by CreatedDate ASC limit 1];
        
        return aa.CreatedDate; 
    }
    
}

Regards
Ashif
 
This was selected as the best answer
Gopinath418Gopinath418
Thanks Ashif. It is working as expected now.