Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Date picker is still shown on click of another input filed #442

Closed
umamaheswarcs opened this issue Feb 23, 2018 · 11 comments
Closed

Date picker is still shown on click of another input filed #442

umamaheswarcs opened this issue Feb 23, 2018 · 11 comments
Labels

Comments

@umamaheswarcs
Copy link

I have clicked on date input filter then date picker shows up. Without the date selection, I clicked(accidentally) on another filter input of any type the first date picker is not hidden.

This is happening for date and range_date filter types.
2 multipl e date pickers

I think focusout event needs to be added for date filter to hide current date picker. I tried this and the date picker is hidden but the value in input field is clearing.

Please check at line 1682 for adding focusout event if necessary for From and To input fields

@vedmack
Copy link
Owner

vedmack commented Feb 23, 2018 via email

@umamaheswarcs
Copy link
Author

Created Test page for 441 and 442 issues jsfiddle.net/umamaheswarcs/UvjnT/2975

@vedmack vedmack added the bug label Feb 28, 2018
@lenamtl
Copy link

lenamtl commented Mar 8, 2018

I'm having similar issue.
I'm using externally_triggered: true

In my case I have date picker - date range
just under it I have a select2
If I click on date picker and I don't select a date and then click on select box
the calendar stay open and select appear half over it

So the problem seems that even if we set datepicker to autoclose: true,
it does not close when clicking on another field.

Note this also occur when using select2 if I don't select an item an click on another Select2 box they all stay open.... so this is not only related to the datepicker...

For example, because the fields are not closing on click they overlaps, the select2 dropdown is over the calendar

yadcf_problems

@lenamtl
Copy link

lenamtl commented Mar 25, 2018

Any new on this?

@vedmack
Copy link
Owner

vedmack commented Mar 25, 2018

not yet, but if you will provide me an api call / etc that closes all open datepickers it will surely speed up the solution

@lenamtl
Copy link

lenamtl commented Mar 25, 2018

I did some tests with select2 and uxsolutions/bootstrap-datepicker
I have not tried other plugin yet but I think the issue will occurred with all plugins that have to open something. When clicking from an input to another input directly (without clicking outside the input )
the first input stay opened and it should be closed.

I have made tests using a regular form and Yadcf form to compare the result.

On regular form
Case 1
click on calendar input this open the calendar view
click inside another input a Select2 dropdown
result : calendar view is now closed and select2 is opened

Using Yadcf form
Case 1
click on calendar input this open the calendar view
click inside another input a Select2 dropdown
result : both input stay opened (calendar should be closed)

On regular form
Case 2
click on select2 input then click inside another Select2 input
result: the first select2 dropdown is now closed and second select2 dropdown is opened

Using Yadcf form
Case 2
click on select2 input then click inside another Select2 dropdown
result: the first select2 is still opened and second select2 is opened
(the first select2 dropdown should be closed)

This is not blocking but make the form look weird if you have several select2 or calendar
see my previous message image to get an idea.

@vedmack
Copy link
Owner

vedmack commented Mar 26, 2018

i know why its not being closed, I just need to know how to close all open datepickers , I might just call a general selector.hide / etc

@lenamtl
Copy link

lenamtl commented Mar 26, 2018

for Select2
there is a close method
https://select2.org/programmatic-control/methods
$('#mySelect2').select2('close');

for uxsolutions/bootstrap-datepicker
there is an option autoclose true but it's getting ignored..
there is a hide method
http://bootstrap-datepicker.readthedocs.io/en/latest/methods.html
$(#mydatepicker).datepicker('hide');

@vedmack
Copy link
Owner

vedmack commented Mar 26, 2018

Thanks, I'm aware of those functions I believe that I will finish working on this issue in the next days

@vedmack
Copy link
Owner

vedmack commented Mar 27, 2018

fixed

as to the select2 mentioned above, please open a new issue with a test case because it does work in showcase, in case you are using an older version of select2 please use a newer, in case that you are using a more recent select2 version please provide a test case

@vedmack vedmack closed this as completed Mar 27, 2018
@lenamtl
Copy link

lenamtl commented Mar 28, 2018

Hi I just created a new case for Select2

Does your fix cover all datepicker type for single date and date range?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants