3

I have timepicker/clockpicker which is configured like this by materializecss (v0.100.2). 

<label for="time">Time</label>
<input id="time" type="text" class="timepicker">

$('.timepicker').pickatime({
   default: 'now'
});

When we click on the text field the clockpicker modal opens, but immediately it gets closed. https://codepen.io/anon/pen/evQxPy

This happens after I have updated my chrome version to 73

Subash
  • 806
  • 8
  • 21
  • 1
    Possible duplicate of [Chrome Update 73 - Materialize CSS JS trigger error](https://stackoverflow.com/questions/55147819/chrome-update-73-materialize-css-js-trigger-error) – Alex K. Mar 22 '19 at 12:28
  • This is a regression in Chrome 73. We have released pickadate 3.6.1 which should resolve this. See https://bugs.chromium.org/p/chromium/issues/detail?id=941910 for the regression in Chrome. –  Mar 24 '19 at 13:18
  • @DanielRuf we use only materialize.js not pickadate.js. So how do we fix it on materialize.js? Thanks – Subash Mar 25 '19 at 03:53
  • materialize uses a customized version of pickadate. See https://github.com/amsul/pickadate.js/pull/1140/files for the needed changes. –  Mar 25 '19 at 04:36
  • But increase the timeout to `100`. –  Mar 25 '19 at 04:37
  • @DanielRuf it's quite hard to find the places to change the logic based on https://github.com/amsul/pickadate.js/pull/1140/files these changes, on materialize.js file. – Subash Mar 25 '19 at 04:50
  • The focus / click handler has to be changed and a function added for the dethrottling. –  Mar 25 '19 at 05:59
  • Which materialize version do you use? –  Mar 25 '19 at 06:02
  • @DanielRuf I use this v0.100.2 – Subash Mar 25 '19 at 06:05

3 Answers3

3

I had the same problem and solved like this way:

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

Hope this will work it is working perfectly for me

Snehil Wani
  • 41
  • 2
1

Not sure, if this is a bulletproof solution but this works for me especially with clockpicker. The version should be materializecss (v0.100.2). In materialize.js file, Line No: 8913

ClockPicker.prototype.show = function (e) {

Just wrap setTimeout( 200 ms) inside this whole function, works well.

Subash
  • 806
  • 8
  • 21
0

@Subash Hi there.

ClockPicker.prototype.show = function (e) {

Just wrap setTimeout( 200 ms) inside this whole function, works well.

For me it works only if I use arrow function cause then I keep "this" from previous context or you have to pass it through setTimeout.

Community
  • 1
  • 1
Max Shkutnyk
  • 1
  • 1