#13251 new bug ()

Opened June 22, 2015 01:10PM UTC

Last modified January 24, 2016 09:24PM UTC

datepicker mousewheel scroll problem inside fixed div

Reported by: tony Owned by:
Priority: minor Milestone: none
Component: ui.datepicker Version: 1.11.4
Keywords: Cc:
Blocked by: Blocking:
Description

the datepicker works great, but when inside a fixed div it does not scroll with its associated element or hide when the mousewheel is used.

I tried to hide the popup on scroll:

$("html, body").on("DOMMouseScroll MouseScrollEvent MozMousePixelScroll wheel scroll", function ()
{
   $('.datePicker').datepicker("hide");
});

This works but the datepicker doesn't re-open unless the element loses focus focus first (e.g. click somewhere). This seems to be a general problem with the datepicker, in fact.

There's a hackish example at http://jsfiddle.net/2pn8Lctd/ which shows both problems (at least in Firefox):

1. click on datepicker 2, then the scrollbar. The datepicker will hide but not re-open unless somewhere else is clicked first.

2. click on datepicker 2 and use the mousewheel to scroll; the datepicker will stay put.

Datepicker 1 works as expected, except the open close issue applies here, too.

Does anyone ave a suggestion how to work around this?

Attachments (0)
Change History (1)

Changed January 24, 2016 09:24PM UTC by rjollos comment:1

description: the datepicker works great, but when inside a fixed div it does not scroll with its associated element or hide when the mousewheel is used. \ \ I tried to hide the popup on scroll: \ \ $("html, body").on("DOMMouseScroll MouseScrollEvent MozMousePixelScroll wheel scroll", function () \ { \ $('.datePicker').datepicker("hide"); \ }); \ \ This works but the datepicker doesn't re-open unless the element loses focus focus first (e.g. click somewhere). This seems to be a general problem with the datepicker, in fact. \ \ There's a hackish example at http://jsfiddle.net/2pn8Lctd/ which shows both problems (at least in Firefox): \ \ 1. click on datepicker 2, then the scrollbar. The datepicker will hide but not re-open unless somewhere else is clicked first. \ \ 2. click on datepicker 2 and use the mousewheel to scroll; the datepicker will stay put. \ \ Datepicker 1 works as expected, except the open close issue applies here, too. \ \ Does anyone ave a suggestion how to work around this? \ → the datepicker works great, but when inside a fixed div it does not scroll with its associated element or hide when the mousewheel is used. \ \ I tried to hide the popup on scroll: \ \ {{{#!javascript \ $("html, body").on("DOMMouseScroll MouseScrollEvent MozMousePixelScroll wheel scroll", function () \ { \ $('.datePicker').datepicker("hide"); \ }); \ }}} \ \ This works but the datepicker doesn't re-open unless the element loses focus focus first (e.g. click somewhere). This seems to be a general problem with the datepicker, in fact. \ \ There's a hackish example at http://jsfiddle.net/2pn8Lctd/ which shows both problems (at least in Firefox): \ \ 1. click on datepicker 2, then the scrollbar. The datepicker will hide but not re-open unless somewhere else is clicked first. \ 2. click on datepicker 2 and use the mousewheel to scroll; the datepicker will stay put. \ \ Datepicker 1 works as expected, except the open close issue applies here, too. \ \ Does anyone ave a suggestion how to work around this? \