dmuy/mdtimepicker

Material design inspired time picker plugin for input elements.

mdtimepicker's Issues

PM reverts back to AM on timepicker close

I've run into an odd behavior with the AM/PM response from the timepicker. Here's how to reproduce it:

• Set the input field to a PM time (I used 1:00PM)
• Open the timepicker by clicking on the field
• Change the hour to 12 specifically.
• Do not click the AM/PM indicators. PM will still be highlighted.
• Click OK.
• Value placed back into input field will now say 12:00AM, not 12:00PM.

The issue seems to be specific to a time that starts as a PM time and is changed specifically to a "12" hour (changing from 2:00PM to 1:00PM returns 1:00PM like it should).

I have the timepicker configured with the following settings:
theme: 'blue',
format: 'h:mmtt',
hourPadding: false,
readOnly: true

I briefly tried using a format of 'hh:mmtt' to test 24-hour mode, and in those cases I got a 00:00 time back instead of a 12:00 time (consistent with the issue outlined above).

Any suggestions? I took a look at the javascript file, but unfortunately my JavaScript skills aren't up to the task yet.

I'm testing with Firefox 60.0.1 64-bit on Linux (Ubuntu Studio).

Thanks!

Code-Typo in Wiki

Hey,

under the Nuxt 3 section there is following line as an example:
nextApp.vueApp.use(vueTimePicker, { theme: 'dark', is24hour: true })

However, it just be "nuxtApp", not "nextApp", little annoying when copy pasting.

Thanks for this project BTW!

Show Minutes Only

What options I need to pass to show minutes only selector?
I want user to choose minutes form 0 to 59.

vue-3 Render Function Fails

vue3-timepicker.js:13 Uncaught (in promise) TypeError: createElement is not a function

Can you tell how to preselected time in time pickers

Also when we edit the form, we have timepicker's value that we got while creating a form, how to show the preselected time in picker?

how to block/disable past time selection

I would like to disable select option on the past hour from now and looks like there is no option set for it.

Feature Request: Should the AMPM button on the top of the picker be clickable to change the period?

Hey there 👋,

So I was trying out the time picker which was amazing btw. Anyway, I just had a little problem with it, the AMPM button cannot be clicked to toggle the period. I have solved this problem by changing the source code locally. It was a simple change, but I just wanted to maybe put this feature live so people do not have to implement it themselves.

Sincerely,

Catalactics (Joshua Pelealu)

how to set step in mdtimepicker

I want to set step for example step: 15 minutes that will look like so in minutes 0, 15, 30, 45, 00 but i can't see any option available for it.

Uncaught TypeError: $(...).mdtimepicker is not a function

4 <script src="assets/vendor/jquery3/jquery.min.js"></script> <script src="assets/vendor/bootstrap4/js/bootstrap.bundle.min.js"></script> <script src="assets/vendor/fontawesome5/js/solid.min.js"></script> <script src="assets/vendor/fontawesome5/js/fontawesome.min.js"></script>

<script type="text/javascript" src="assets/vendor/mdtimepicker/mdtimepicker.js"></script>

<script src="assets/js/script.js"></script>
<script>
    $('.timepicker').mdtimepicker(); // Initialize time picker
</script>

"Uncaught TypeError: $(...).mdtimepicker is not a function"

I'm trying to use it that way and get this error, how can I solve it?

minTime, maxTime features (like I used in duDatepicker) to block time, i.e falling into past.

Please help me to get this feature as much as faster you can update. Thanks!! Appreciation.

readOnly: false option (and inline: true option)

I noticed this option in a sample on this site (https://www.jqueryscript.net/time-clock/Material-Time-Picker-Plugin-jQuery-MDTimePicker.html):

readOnly: false

It isn't listed in the options though and doesn't do anything when set.

Are there plans to support it?! I'd like to be able to enter time by typing on the keyboard in addition to the GUI.

p.s. also, any plans to support an inline: true option too to embed the MDTimePicker directly in a body div instead of an input field?

writing own time

The time pickers's time is not updated when you write your own time in the input field. I presumed that when I write say 5:00 PM in the input field then the clock arms are pointed to 5:00, PM button is active state and the time displayed is also updated to correspond to what was written. Just a suggestion though.

Set DEFAULTS

In the older jQuery version was a way to set defaults like so:
$.extend($.fn.mdtimepicker.defaults, { timeFormat: 'hh:mm:ss.000', format: 'hh:mm', theme: 'custom', readOnly: true, hourPadding: false, strCancel: 'stornieren', strOk: 'Ok', is12Hour: false });

This should be implemented again in a similar way..

Suggenstion: add custom theme as option

Suggenstion:
It would be great if a custom theme could be passed as an option.
Now i overrule the default theme but if i can pass the theme name as an option i do not have to overrule the default theme.