19 Apr 20172 minutes to read

TimePicker supports globalization with different culture.

Enabling Globalization Support

The following steps explains you on how to enable Globalization support for TimePicker.

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

  • HTML
  • <input type="text" id="time" />
  • HTML
  • <html>
        <!--You can enable localization property using the following code example.-->
        <title>Essential Studio for JavaScript : Timepicker </title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8" />
        <!-- Style sheet for default theme (flat azure) -->
        <link href="" rel="stylesheet" />
        <script src=""></script>
        <script src=""></script>
        <script src=""></script>
        <div class="content-container-fluid">
            <div class="row">
                <div class="cols-sample-area">
                    <div class="frame">
                        <div class="control">
                            <input type="text" id="time" accesskey="j"/>
        <script type="text/javascript">
            $(function () {
                    locale: "zh-CN"


    jQuery.easing external dependency has been removed from version onwards. Kindly include this jQuery.easing dependency for versions lesser than in order to support animation effects. jQuery.globalize has been removed from version onwards. For version lower than, refer jQuery.globalize.min.js along with ej.web.all.min.js to support globalization.

    Execute the above code to render the following output.