chingyawhao / materialize-clockpicker Goto Github PK

Can we have an event/callback on value set?

I am using materialize library in my angular js web app. Am also using grunt as my building tool. Due to my existing materialize library am getting conflict using materialize clockpicker library as it is dependent on some lower version on Materialize (as specified in your package.json file.). Due to this am unable to use the clock pickers when am creating a build using grunt.

Kindly help me sort out this issue.

Hello man! I began this project:

https://github.com/fega/materialize-helpers

we could merge the projects.
what do you think?

I have a modal in which one form is there. I am using the clockpicker inside that form. Before opening the clockpicker, there is no horizontal scroll bar in the page but after closing the clockpicker, a horizontal scroll bar appears. This horizontal scroll bar disappears when the modal is closed.

I tried opening a clockpicker from a modal. In chrome everything is fine, but on safari the clockpicker is cutoff. I played with the css, particularly, the z-index and couldn't figure out why.

For example, I have a thing like "How many minutes until you arrive?" and would like a 5-10-15-20 minute picker similar to yours

I'm using your clockpicker library in combination with the timepicker from materialize.

Both of them are using the picker__date-display class for the div containing the date or the time. By using the same class the styling gets overridden.

Is it possible to change the class maybe to picker__time-display? If so, I could offer a pull request.

Hi and thans for bring a Time Picker into Materialize :)

I just want to make the minutes picker step with 15min (00-15-30-45). I had succeed to hide the other value but I can't prevent the picker to step 1min by 1min. Could you help me? I saw that plenty of ask for it from the wearoutman version, I think it will be helpfull ^^

I installed clockpicker as node-module.
npm i materialize-clockpicker --save

Then I imported it as,
require("materialize-clockpicker");
It throws materialize-clockpicker module not found.

If I import it as require it as require("/node_modules/materialize-clockpicker/dist/js/materialize.clockpicker.js")
then it throws, pickatime is not a function.

Am I importing it wrong?

Hi. the scrollbar gets hidden whenever the timepicker opens causing the page to tilt to the right. :)

I use this with react and webpack, so I imported the dist css file into my stylesheet in order for it to be bundled. Like this:
@import "../node_modules/materialize-clockpicker/dist/css/materialize.clockpicker.css";

Webpacks css-loader would then complain that the file "/bower_components/Materialize/sass/components/_color.scss" is not in the SourceMap. Which is naturally correct in my case, since I didn't install Materialize using bower.

I solved it manually by deleting the sourcemap line from the dist css file.

Can you fix it so that it doesn't directly depend on Materialize to be installed using bower - there quite a few different "installation methods" after all. (bower, npm, cdn, etc.)

Thank you for a much needed Materialize timepicker though.

I just created my form in materialize model and used materialize-clockpicker in it. Its working fine from outside the model but when opening in model its opening in model its showing inside the model but i need to append that clock in document body, so is it possible to do this?

Thanks

Sass has a problem when compiling it.

@import "Materialize/sass/components/mixins"; not found ---> when I checked the code in node_modules the materialize components is not there it is lacking..

Webpack has a problem when imported it.

Cannot resolve the file which I cannot see also the .JS file.

Like this issue when default value is provided such as '09:14' the clock does not set to AM. it's always PM.

What events can I call?

Hi can you possibly add your project to bower?

I have the initialization as:

$('#startDatetime').pickatime({
          autoclose: true,
          twelvehour: false
        });

However, the clock still comes up as this:

Am I missing something here?

Thank you for this package!

But I'm getting the error

Unable to resolve some modules:

  "js/materialize.clockpicker.js" in
[...]/node_modules/materialize-clockpicker/package.json
(web.browser)

because the package.json is not fixed. Please release the latest 1.0.1 version to npm. Thank you!

When clicking the input with mousedown, the clock picker pops up but on mouseup it disappears.

There is no button to reset the selected time as it is there in the Materialize Date Picker. If user wants to clear the text field containing the time. He can't do because clicking on the text field doesn't allow to edit the text as the clock picker is opened.

Hey everyone!

I am using materialize timepicker in my project, and I can't get it to display correctly.

Here's what I get:

Here's what I should get:

Here's my code: demo

`

When you set the twelvehour at false, PM is still displayed in the clockpicker-display div.

I need a time picker for my materializecss web project. your project working fine. but after adding your css and js, its not popping. simply displaying inside input box. Any fix????

My HTML:

<input id="start_time" type="time">

My jquery script:

            $('#start_time').pickatime({
                autoclose: false,
                twelvehour: true
            });

And this is only triggered when I select the time for the first time:

        $(document).on('change','#start_time',function(){ 
            console.log('changed');
        });

When I change the time to something else changed is not logged to console.

Am I missing something basic here or is this a desired behaviour?
How do I proceed with checking if the time has changed?

Hi ho,

first of all: thx for creating this awesome piece of code.
I am about to integrate your Materialize clock picker into my Yii2 Materialize repo.

Could you please create a release (and further later on when issuing new features or bugfixes)? This makes maintaining and requiring (Composer) easier as I can clearly state the version I need.

Thanks a lot in advance.

Cheers

I just included a wrapper for this clockpicker in the angular-materialize project.

You can see the commit here: krescruz/angular-materialize@25e6d98

If you have any comments (or a better way to include it), please let me now.

If not, just close this issue.

I tested the code from the readme and the last section contains the code
<script> $('#timepicker').pickatime({ autoclose: false, twelvehour: false, afterDone: function(Element, Time) { console.log(Element, Time); } }); </script>

After testing the callback, undefined is returned for both Element and Time.
Is there a callback for when someone completes the picking process?

The now value for default attribute shows the time(hour and minute) correctly but AM/PM is always on PM.

Just as you can clear the date selected using the Materialize Datapicker, it would be neat to be able to clear the picked time as well. For now I've had to settle with adding a button next to the field, to clear it, but that solution isn't pretty - especially with a datepicker right next to it that has a clear button.

Can I disable some range of time?