CODEWITHSUNDEEP
jqueryjquery-uijquery-plugins
codeandcloud
codeandcloud

Reputation: 55248

Localizing the jQuery UI TimePicker plugin

I've been using this wonderful Adding a Timepicker to a jQuery UI Datepicker

In my example I am using an HTML select to change the locale of my calendar (English and Italian).
I have been able to localize the datepicker inside the calendar, but I am unable to localize the timePicker inside the same.

I would like to change the timeText, hourText and minuteText but cannot figure a way out.
For example it would like to change hourText from "Hour" to "Ora"

I have tried

$(".order-date").datetimepicker("option", "timeText", currentCulture == "en" ? "Time" : "Tempo");
$(".order-date").datetimepicker("option", "hourText", currentCulture == "en" ? "Hour" : "Ora");
$(".order-date").datetimepicker("option", "minuteText", currentCulture == "en" ? "Minute" : "Minuto");

But this is not working. What am I missing here?

Demo of what I have done till now: http://jsfiddle.net/naveen/qysVp/

Upvotes: 4

Views: 3475

Answers (1)

Prasenjit Kumar Nag
Prasenjit Kumar Nag

Reputation: 13461

I am not sure if this is the best way and as I didn't find any dynamic way to change the text through option, You can use the following code to achieve this

 var timeText =  currentCulture == "en" ? "Time" : "Tempo";
 var hourText =  currentCulture == "en" ? "Hour" : "Ora";
 var minuteText  =  currentCulture == "en" ? "Minute" : "Minuto";

 $(".order-date").datetimepicker('destroy');
 $(".order-date").datetimepicker({
        ampm: true,
        hourText : hourText,
        minuteText: minuteText,
        timeText: timeText,

 });
 $(".order-date").datetimepicker("option", $.datepicker.regional[currentCulture]);

By destroying and reinitiating datepicker with updated settings.

Working Fiddle

Upvotes: 3

Related Questions