Search code examples
jquerydatetimepickerdatetime-format

jquery custom time format for datetimepicker

i am using this third party datetimepicker plugin for my date and time picking functionality. i want to customize my time format to 12 hour format with AM/PM, i have changed my code to achieve this 

$('#startTime').datetimepicker({
            datepicker : false,
            format : 'g:i A'
});

this some how satisfied my requirement, when i select a time it displays in 12 hour format in the input box, but my date picker ui displays still in 24 hour format, i have tried this 

{allowTimes:[
  '09:00 AM',
  '11:00 AM',
  '12:00 PM',
  '21:00 PM'
]}

but it doesnt work, is there a way so that i can change the default setting to 12 hours instead of 24 hours.

Solution

  • You need to set the option formatTime as this formats the times in the datepicker UI:

    $('#startTime').datetimepicker({
    datepicker: false,
    format: 'g:i A',
    formatTime: 'g:i A'
});

    See this Fiddle