Timepicker always shows PM by default

Topic: Timepicker always shows PM by default

logiczone free asked 7 years ago

I haven't tried other scenarios but when I set the timepicker's default to "now", the clock shows the correct time but it always shows "PM". $("#input").pickatime({ default: "now" });

Add comment

sweta648 free answered 4 years ago

0 0 Best answer

Hello sir, I am facing same problem in clockpicker, when i am clicking in AM/PM clockpicker is hide and by default it will take PM. Please give me solution for it. Here is my code. $('.clockpicker').clockpicker({ twelvehour: true });

Grzegorz Bujański staff commented 4 years ago

Hi. How can I reproduce this issue? Can you create snippet here: https://mdbootstrap.com/snippets ?

Add comment

swipiidev free answered 7 years ago

0 0 Best answer

Thanks Rafal!

Add comment

Rafał Rogulski free answered 7 years ago

0 0 Best answer

Hi,

Sorry for a long response time, but I had to find what is a reason of this. It is a bug in script wich always show "PM", we will fix it in next release.

Your problem we can fix with couple line o JavaScript:

<pre><code>var timeToSend = $("#timeToSend").pickatime({
    twelvehour: true,
    default: 'now',
    afterDone: function() {
        var picker = timeToSend.data().clockpicker;

if(picker.options.twelvehour) {       
            var hours = picker.hours;
            var minutes = picker.minutes;
            var amOrPm = "AM";

if(minutes < 10) {
                minutes = "0"+minutes;
            }

if( new Date(Date(00)).getHours() >= 12) {
                amOrPm = "PM";
            } else {
                amOrPm = "AM";
            }

$("#timeToSend").val(hours + ":" + minutes + amOrPm);
        } 
    },
    afterShow: function() {
        var picker = timeToSend.data().clockpicker;
        if(picker.options.default == 'now') {
            if( new Date(Date(00)).getHours() >= 12) {
                $('.pm-button').trigger( "click" );
            } else {
                $('.am-button').trigger( "click" );
            }
        }
    }
});</code></pre>

<code>afterDone</code> methods fix time pass to input, <code>afterShow</code> methods trigger a click event on PM or AM buttons and automatically change it in time picker.

Regards

Please insert min. 20 characters.

Hi, Sorry for a long response time, but I had to find what is a reason of this. It is a bug in script wich always show "PM", we will fix it in next release. Your problem we can fix with couple line o JavaScript:

var timeToSend = $("#timeToSend").pickatime({
    twelvehour: true,
    default: 'now',
    afterDone: function() {
        var picker = timeToSend.data().clockpicker;

        if(picker.options.twelvehour) {       
            var hours = picker.hours;
            var minutes = picker.minutes;
            var amOrPm = "AM";

            if(minutes < 10) {
                minutes = "0"+minutes;
            }

            if( new Date(Date(00)).getHours() >= 12) {
                amOrPm = "PM";
            } else {
                amOrPm = "AM";
            }

            $("#timeToSend").val(hours + ":" + minutes + amOrPm);
        } 
    },
    afterShow: function() {
        var picker = timeToSend.data().clockpicker;
        if(picker.options.default == 'now') {
            if( new Date(Date(00)).getHours() >= 12) {
                $('.pm-button').trigger( "click" );
            } else {
                $('.am-button').trigger( "click" );
            }
        }
    }
});

afterDone methods fix time pass to input, afterShow methods trigger a click event on PM or AM buttons and automatically change it in time picker. Regards

sweta648 free commented 4 years ago

Add comment

swipiidev free answered 7 years ago

0 0 Best answer

Any one any advice around this?

Add comment

swipiidev free answered 7 years ago

0 0 Best answer

Hi, Here is our HTML & Javascript if that helps. <input name="timeToSend" placeholder="Time to send" type="text" id="timeToSend" class="form-control timepicker" value="10:30AM"> $('#timeToSend').pickatime({ twelvehour: true }); When we initially launch the picker we see 10.30PM. If we select AM after that it works fine. If you need any more info, let us know.

Add comment

swipiidev free answered 7 years ago

0 0 Best answer