flatpickr / flatpickr

lightweight, powerful javascript datetimepicker with no dependencies
https://flatpickr.js.org
MIT License
16.19k stars 1.46k forks source link

Picker shouldn't open on focus (or make this behaviour optional) #2703

Open grahamharper opened 2 years ago

grahamharper commented 2 years ago

Summary

Currently, the date picker opens when the input receives focus.

https://github.com/flatpickr/flatpickr/blob/master/src/index.ts#L453

if (self.config.clickOpens === true) {
      bind(self._input, "focus", self.open);
      bind(self._input, "click", self.open);
    }

I propose changing the behaviour of so it does not open on focus but instead only opens when the user interacts with it, either by clicking on the field with the mouse or pressing the down-arrow while the field is focussed.

If this can't/shouldn't be the default then make it optional e.g. a focusOpens option that when set to false behaves as I've described. Similar to clickOpens.

e.g.

if (self.config.clickOpens === true) {
      bind(self._input, "click", self.open);
    }

if (self.config.focusOpens === true) {
      bind(self._input, "focus", self.open);
    }

Justification

When the date picker input field is the first field in a modal dialog it should be focussed automatically (as per web authoring standards) when the modal opens and thus the picker opens also, which is unexpected, annoying, distracting and can obscure some of the content of the modal.

Also, when tabbing through a large form, such as when skipping over optional fields, or navigating to a field to correct an error, if the user tabs through one or several date picker fields, this is annoying and distracting, adding cognitive load.

julian-kuroiwa commented 2 years ago

Heyy!

Any updates about this feat?

ddtbuilder commented 2 months ago

agree with this...annoying to have it pop open on focus