We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

I want to change the datepicker format

Thread ID:





140885 Nov 13,2018 06:31 AM UTC Nov 14,2018 08:42 AM UTC Angular - EJ 2 1
Tags: DateTimePicker
Muthukumar Periasamy
Asked On November 13, 2018 06:31 AM UTC

Hai Team,

      I am developing a web application using angular 4 (Typescript) and Asp.Net Core.I am using a date field in my form in that I need to change the format for the Datetimepicker as DD/MM/YYYY. So Please provide a quick solution for this request.

Herewith I attach my code please check it and get back to us soon.

    <input type="text" [(ngModel)]='safetyenvinstance.incidentDatetime' name="incidentdatetime" e-dateformat="dd-MM-yyyy" enableStrictMode="true" id="incidentDateTime"      ej-datetimepicker width='320px' #nameIncidentDateTime="ngModel" watermarkText="Enter Incident Datetime" required autocomplete="off">


Deepa Loganathan [Syncfusion]
Replied On November 14, 2018 08:42 AM UTC

Hi Sridhar, 
Thanks for contacting Syncfusion support. 
We have checked the code snippet provided in your last update and saw that you have used the e-dateformat to set the format for Datetimepicker which is not a property of Datetimepicker helper. So we suggest using the dateTimeFormat  API to set the date and time format of Datetimepicker as given in the below code. 
<div class="cols-sample-area" style="height:400px; margin:0 auto;"> 
            <input type="text" ej-datetimepicker id="datetimepick" dateTimeFormat="dd/MM/yyyy"/> 
Please check the below help page to know more about the APIs available in Datetimepicker component.  
For your convenience, we have prepared a simple application using angular 4 and ASP.NET Core to showcase the usage of Datetimepicker component. Please check the below link. 
Once the sample is downloaded and unzipped, please run the below commands to run the sample and navigate to http://localhost:5000/  to see the output. 
  • npm install  
  • npm install syncfusion-javascript --save  
  • npm install ej-angular2 --save  
  • npm install --save-dev @types/jquery  
  • npm install --save-dev @types/ej.web.all  
  • npm run build  
  • dotnet run
Also, check out the following links to know more about DateTimePicker in Angular platform. 
Please, let us know if you need any further assistance. 
Deepa L. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon