Timepicker always shows PM by default


Topic: Timepicker always shows PM by default

logiczone asked 3 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" });
Can you post your HTML markup with this #input her??

swipiidev answered 3 years ago

We are having the same problem did anyone get a fix for this?

swipiidev answered 3 years ago

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.

swipiidev answered 3 years ago

Any one any advice around this?
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 commented 3 months ago

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 });


swipiidev answered 3 years ago

Thanks Rafal!

sweta648 answered 3 months ago

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 3 months ago

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


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags