0

I have a custom LWC displaying a Datatable. One of the columns for the Datatable is 'Activity Date'. It looks like the Date being passed into the Data Table and the Date displayed are off by a single day.

HTML:

    <lightning-card title="All Activity" icon-name="standard:task">
        <div slot="actions">
            <lightning-button-icon icon-name="action:refresh" alternative-text="Refresh" size="Medium"
                onclick={refreshActivity} style="margin-right: 10px;">
            </lightning-button-icon>

            <lightning-button-icon icon-name="utility:add" alternative-text="Refresh" size="Medium"
                onclick={addActivity}>
            </lightning-button-icon>
        </div>   

        <div class="slds-m-around_medium" if:true={activityList}>
            <!-- Loop Through data and display -->
            <lightning-datatable 
                key-field="sId" 
                hide-checkbox-column 
                data={activityList} 
                columns={activityColumns}
                >
            </lightning-datatable>
        </div>
        <div class="slds-m-around_medium" if:true={error}>
            <p>Sorry there was an error</p>
        </div>
    </lightning-card>

JS Columns:

 import {LightningElement, wire, api, track} from 'lwc';
import getActivityAndNotes from '@salesforce/apex/viewAllActivityNotesOnAccountLEX.getActivityAndNotes'
import { refreshApex } from '@salesforce/apex';
import Id from '@salesforce/user/Id';
import insertTask from '@salesforce/apex/InsertRecord.createTask';

export default class AccountActivity extends LightningElement {

    // Variables
    @api recordId;
    @api objectApiName;
    @track activityList;
    @track error;
    userId = Id;

    activityModal = false;
    activitySubject;
    activityDescription;

    activity;
    wiredActivityResult;

    activityColumns = [
        { 
            label: 'Subject',
            fieldName: 'sActivitySubject', 
            type: 'text', 
            initialWidth: 200,
        },
        { 
            label: 'Comments', 
            fieldName: 'sActivityComments',
            type: 'text',
            initialWidth: 400
        },
        { 
            label: 'Type', 
            fieldName: 'sActivityType', 
            type: 'text',
        },
        { 
            label: 'Activity Date', 
            fieldName: 'sActivityDate', 
            type: 'date', 
            initialWidth: 100
        },
        { 
            label: 'Assigned To', 
            fieldName: 'sActivityOwner', 
            type: 'text', 
            initialWidth: 100
        },
    ];
    

    @wire(getActivityAndNotes, {accountId: '$recordId'})
    activityResult(result){

        console.log('Activity Result:');
        console.log(result);

        this.wiredActivityResult = result;

        if(result.data){

            console.log('Activity Data Retrieved');
            this.activity = result.data;
            console.log(this.activity);
            console.log('Activities Data: ', result.data.Activities);
   
            this.activityList = result.data.Activities;

        } else if(result.error) {
            
            console.error('Activity Data Error');
            console.log(result.error);
            this.error = result.error;
        } else {

            console.log('Unknown Activity Data Result');
        
        }
    }

There is no Data manipulation within the JS of the LWC but it looks like the date displayed is changed by one. Here is the Data passed into the LWC:

enter image description here

Here is what is displayed:

enter image description here

Any assistance or direction would be greatly appreciated.

  • how your subject is having proper date and activity date is not. – Ysr Shk Oct 19 at 16:32
  • if you can post some code snippet, then it might be helpful for some of us to direct you in proper area. – Ysr Shk Oct 19 at 16:33
  • @YsrShk added full js, let me know if there is more information you need to assist - thanks – Max Oct 19 at 16:45
  • 1
    Can you try date-local instead of date. As per documentations it tries to convert datetime. Also what's the locale of user(is it same or different than the stored data). – Ysr Shk Oct 19 at 16:53
  • Yep, that was the issue. Once I changed it to date-local the dates matched. Thanks – Max Oct 21 at 16:34
1

In lightning-datatable, the type: 'date' is considered as DateTime, while type: 'date-local' is considered as Date. I'm not sure why such naming was chosen, but see Displaying Date and Time Using Type Attributes in https://developer.salesforce.com/docs/component-library/bundle/lightning-datatable/documentation

The key difference between DateTime and Date is that in the latter, timezones do not matter. A date is a date, across the globe. But if you interpret 2020-10-09 as an UTC datetime, as in "midnight in London", then the issue is that Oct/09 00:00:00 in UTC is Oct/08 17:00:00 on the West Coast.

| improve this answer | |

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.