Bug when changing the browser tab

[blackgrow]

Hey guys! When i open the calendar then close and when you switch to another tab of the browser and return to the one where the calendar was opened, does it open itself again? why is this happening? Can this be how to muffle it?

[aletiger]

I noticed the same problem with all browsers. Is there a way to solve this issue?

[aletiger]

I investigated the problem. I think that is related to the fact that the input field has the focus and the calendar is always opened on the focus event. The date picker has the focus, so when you are back from another tab, the calendar will show up again.

I'm not able to get the focus lost when I close the calendar the first time. Any idea?

[aletiger]

@blackgrow If you are interested this should be a working solution.

<script> $('.datepicker').pickadate(); var $input = $('.datepicker').pickadate(); var picker = $input.pickadate('picker'); picker.on({ close: function() { console.log('Closed now'); $(document.activeElement).blur(); }, }) </script>

You need to blur() the focus when the calendar is closed. Best regards.

[topest1]

CSS Workaround

.picker__holder{
	pointer-events: none;
}
.picker__frame	.picker__wrap{
	pointer-events: auto;
}

[00dav00]

I think this bug was already reported on #160

The work around n that worked for me was adding the following to the initialization options:

   onClose: function(){
        $(document.activeElement).blur();
    }

[Rykus0]

Just note that blurring the active element upon closing the calendar would be bad for anyone using keyboard navigation, or who similarly relies on focus, and hurts accessibility.

[CptMeatball]

CSS workaround fixes this. Is there any reason that this should not be added to the project?

JS solutions feel dirty, if a pure CSS solution also does the trick. Also, using blur does fix the problem but adds another one.

[xtianus]

CSS workaround does not work for me in v3.6.0