Issue with date field format | Community
Skip to main content
Level 2
February 22, 2023
Solved

Issue with date field format

  • February 22, 2023
  • 3 replies
  • 1751 views

I have added datepicker field to dialog for DOB option. When submitting the field the value is getting stored in the following format 2023-02-28T00:00:00.000+05:30.

But I would want to display only the date (Ex: 2023-02-28) without time and timezone info in it.

 

I have followed: https://blogs.perficient.com/2018/10/18/a-way-to-handle-dates-in-aem/

 

Added additional field to dialog with properties as shown in above article:

 

DOB is the actual DOB field and DOB0 is the additional field added with name property including @TypeHint

 

The Properties for the DOB0 are as follows:

 

Properties for DOB are as follows:

But while submitting the date field from dialog, it shows an error message as "invalid payload".

 

 

When I change the valueFormat property to from YYYY/MM/DD to YYYY-MM-DD, the value is getting saved again in following format:

2023-02-28T00:00:00.000+05:30.

 

Can someone help me on how can I show only date without time for datepicker field please? Thanks!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by krishna_sai

Hi @srk381 ,
Can you please try something like this


and saved property looks like this


Hope this works.
Thanks,

Krishna

3 replies

krishna_sai
Community Advisor
krishna_saiCommunity AdvisorAccepted solution
Community Advisor
February 23, 2023

Hi @srk381 ,
Can you please try something like this


and saved property looks like this


Hope this works.
Thanks,

Krishna

SivakumarKanoori
Community Advisor
Community Advisor
February 23, 2023

@srk381 

use it as below.

<duedate
  granite:rel="project-duedate"
  jcr:primaryType="nt:unstructured"
  sling:resourceType="granite/ui/components/coral/foundation/form/datepicker"
  displayedFormat="YYYY-MM-DD"
  fieldLabel="Due Date"
  minDate="today"
  name="taskDueDate"
  type="datetime"/>
  <duedatetypehint
  jcr:primaryType="nt:unstructured"
  sling:resourceType="granite/ui/components/coral/foundation/form/hidden"
  name="taskDueDate@TypeHint"
  type="datetime"
  value="Calendar"/>
Thanks,Siva
arunpatidar
Community Advisor
Community Advisor
February 23, 2023