how to set am/pm format in jquery using datetimepicker

Question

this is my jquery code.eventdatpicker is display date only,but occasionStartTime and occasionEndTime it display 24 hours format only how to change this format to am/pm forma

Answer 1

$('#StartDate').datetimepicker(
                {
                    format: 'DD MMM YYYY hh:mm A'

                });

where startDate is a divId

    <div class="input-group date form_datetime" id="StartDate">
         <input type="text" class="form-control input-lg" placeholder="From" name="StartDate" id="txtStartDate" required /> 
<span class="input-group-addon">
<span class="glyphicon-calendar glyphicon"></span></span>
 </div>

This will give you format like: 25 Mar 2016 01:08 PM

Answer 2

in nowdays version, 2021 / 1 / Jan you have to type in e.g.:

        $('#dateTimePicker').datetimepicker({
            .....,
            formatTime:'g:iA',
            format: 'Y.m.d hh:mm A',
            .....
        }

And you are done

Answer 3

Use this plugin to unobtrusively add a datetimepicker, datepicker or timepicker dropdown to your forms. It's easy to customize options.

You can download Plugin: Download

add js and css to head tag:

<link rel="stylesheet" type="text/css" href="./js/jquery.datetimepicker.css" />
<script src="./js/jquery.datetimepicker.js"></script>

add this code to you want show:

$(function () {
    $('#video_schedule').datetimepicker({
        step:5,
        minDate:0,
        formatTime:'H:i'
    });
});

Answer 4

$('#occasionStartTime').datetimepicker({
        format: 'Y/m/d A g:i',
        formatTime: 'A g:i',
    });

Answer 5

If you've only got a time field instead of a datetime field - you can set AM/PM format using

 $("#yourTimeField").timepicker({
        showPeriod: true
 });

Answer 6

Try

$('#occasionStartTime').datetimepicker({
    datepicker : false,
    ampm: true, // FOR AM/PM FORMAT
    format : 'g:i A'
});