Time Format

3 Aug 20171 minute to read

TimePicker widget provides you an option to change the time format.

Steps to change Time Format of TimePicker widget

The following steps explains you to change the time format for the TimePicker.

In the HTML page, add a <input> element to configure TimePicker widget.

  • HTML
  • <input type="text" id="time" />
  • /// <reference path="tsfiles/jquery.d.ts" />
    /// <reference path="tsfiles/ej.web.all.d.ts" />
    module TimePickerComponent {
        // Change time format for TimePicker controls as follows.
        $(function () {
            var timeSample = new ej.TimePicker($("#timepick"), {
                timeFormat: "h:mm:ss tt"

    Execute the above code to render the following output.