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

How to set the control to 24-hour system?

hi,How to set the control to 24 hours and add the onchange method to this control, I have to do some validation in js

3 Replies

DL Deepa Loganathan Syncfusion Team February 20, 2019 07:14 AM UTC

 
Hi Pomelobutter,  
 
Thanks for contacting Syncfusion support.  
 
You can set the Time display format and capture Change event of Datetimepicker with the timeDisplayFormat API and Change event of Datetimepicker respectively. This is depicted in the below code. 
 
 
<ej-date-time-picker id="dtp" time-display-format="HH:mm" change="validate"></ej-date-time-picker> 
 
 
<script> 
    function validate() { 
        console.log("DateTimepicker value selected"); 
    } 
</script> 
 
 
Note: The timeDisplayFormat will override the format given in dateTimeFormat. 
 
Please check the below help pages to explore more about the configuration options available in Datetimepicker.  
 
 
 
Validating Datetime input 
 
You can validate the value Datetime input values by using ValidationRules and ValidationMessages APIs as given in the below help link. 
 
 
Regards,  
Deepa L. 
 



PO pomelobutter February 20, 2019 08:20 AM UTC

hi,I didn't use ej1, I am using ej2 now.


DL Deepa Loganathan Syncfusion Team February 20, 2019 09:50 AM UTC

 
Hi Pomelobutter,   
 
Sorry for the misunderstanding.  
 
You can set the Timeformat of EJ2 Datetimepicker with timeFormat API as given in the below code.  
 
<ejs-datetimepicker id="dtp" change="Validate" timeFormat="HH:mm"></ejs-datetimepicker> 
 
<script> 
    function Validate() { 
        console.log("DateTimepicker value selected"); 
    } 
</script> 
 
Please check the below link to explore more about APIs of EJ2 Datetimepicker. 
 
 
To implement validation in Datetimepicker, we suggest using our inbuilt Form Validator. In the below help page, we have depicted the usage of Form validator with Datetimepicker.  
 
 
Please check the below API documentation to explore more about the options available in Form Validator plugin and let us know if you have any further queries. 
 
 
Regards,  
Deepa L. 


Loader.
Up arrow icon