date picker and time picker not editable in chrome

[gallaszlo]

In chrome if the input date contains any data and you click to edit, the date picker shown up but it closes automatically and you can't change the value, On your demo page you can test it: https://krescruz.github.io/angular-materialize/#input-date

[danswater]

same issue, since angular materialize is dependent of materialize lib
Dogfalo/materialize#6312

[anfho93]

I have the same issue

[rupesh9]

+1

[akshayrao14]

+1
The calendar stays until the mouse click is lifted. If I keep the mouse clicked, it stays, but that doesn't help much.

[ersonukr]

+1

[webbiesdk]

It seems the bug is in the pickadate plugin included in Materialize and/or Chrome

It might fix the issue to simply include the latest version of pickadate on top of Materialize (https://amsul.ca/pickadate.js/), I have not tested this.

But I don't think we should do anything here before the Materialize issue has been closed.

There are some temp solutions in the issues linked above, you can use those for now.

If someone finds a way to fix the issue in this code-base, then pull-requests are welcome.

[webbiesdk]

Also: I can't seem to replicate the issue on my machine, so it would be hard for me to fix it.

[anfho93]

The version of chrome affected is 73 i solved by changing and adding some timeouts in materialize and materialize.clokpicker.js files El mar., 2 abr. 2019 a las 8:47, webbiesdk (<notifications@github.com>) escribió:

…

Also: I can't seem to replicate the issue on my machine, so it would be hard for me to fix it. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#233 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ACTugqBf28BlCZROjYemWj_V-Awy3dc2ks5vc19vgaJpZM4cQ_W9> .

-- Andrés Felipe Herrera Ingeniero de Sistemas y Computación. Administrador de Infraestructura Tecnológica en SmartenIT Docente de la Universidad del Quindío

[preeti-sharmaAvanti]

I also have the same issue.

[amandadianni]

I followed the suggestion on this stackoverflow's post and it worked for me:
https://stackoverflow.com/questions/55200244/materialize-date-picker-automatic

EDIT
Since the answer is not accepted in stackoverflow yet, I'm posting here:
$('.datepicker').on('mousedown', function(event) { event.preventDefault(); });

[akshayrao14]

@amandadianni thanks!

[rupesh9]

Thank You @amandadianni. The solution given on the link given by @amandadianni works for me after a small change. I changed the class "datepicker" to "picker__input".

$(document).on('mousedown', '.picker__input', function(event){
  event.preventDefault();
})

[gallaszlo]

Thanks. If you use timepicker too, you have to use the following:
$(document).on('mousedown', '.timepicker', function(event){ event.preventDefault(); })