Local Time Zone for picker values

[Mike Schall]

Is it possible to have the value written to the Reactive Form for both TimePicker and DateTimePicker to not include time zone information and set what the user entered?  

For example, if the user selects 2:00pm.  I want the value in the formGroup to be 2:00pm, not UTC and adjusted for their time zone.

https://stackblitz.com/edit/angular-co5dwt?file=app.component.html

[Berly Christopher]

Hi Mike, 

  

Greetings from Syncfusion support.  

  

We would like to inform that, our EJ2 date components will be rendered based on the current machine local time zone as per the standard behaviour. If you want to process the date value with desired format such as value without local time zone means you need to convert and make use of it as per the application needs externally.  

  

Here, we have showcased the TimePicker and DateTimePicker value without converting the value to the time zone by using Angular Date pipe. Kindly refer the below code example. 

  

    <form [formGroup]="skillForm" novalidate id="formId"> 

                <div class="form-group"> 

                    <ejs-timepicker formControlName="time" name="time" [(value)]='skillForm.selectedTime' placeholder='Select a time' 

                        floatLabelType='Auto' > 

                    </ejs-timepicker> 

                    <ejs-datetimepicker formControlName="datetime" [(value)]='skillForm.selectedDateTime' name="datetime" placeholder='Select a date/time' 

                        floatLabelType='Auto'> 

                    </ejs-datetimepicker> 

                </div> 

                <fieldset> 

                    <legend>FormGroup</legend> 

                    <pre>TimePicker UTC value: {{ skillForm.selectedTime  | date :'shortTime'}}</pre> 

          <pre>DateTimePicker UTC value: {{ skillForm.selectedDateTime  | date :'short'}}</pre> 

                </fieldset> 

            </form> 

 

  

Please find the sample from the below link. 

Sample Link: https://stackblitz.com/edit/angular-co5dwt-g8udid?file=app.component.html 

  

To know more about Date pipe in Angular platform, please refer the below Angular forum link. 

Link: https://angular.io/api/common/DatePipe 

  

Regards, 

Berly B.C