Ticket #5626 (closed bug: fixed)
DatePicker doesn't work inside fixed div
| Reported by: | kbwood | Owned by: | |
|---|---|---|---|
| Priority: | minor | Milestone: | 1.8.22 |
| Component: | ui.datepicker | Version: | 1.8.1 |
| Keywords: | Cc: | ||
| Blocking: | Blocked by: |
Description
Forum: http://forum.jquery.com/topic/datepicker-doesn-t-work-inside-fixed-div.
I tried putting DatePicker inside of a fixed position div that is attached to the bottom of the viewport. When clicking on the input box that should open the calendar, I see in Firebug that the dimensions of the calendar box slide out, but the box doesn't appear where it should above the input. Is this expected? I'm assuming there is some conflict with it being inside a fixed div. And is there any known way to use DatePicker from within a fixed div?
Change History
comment:2 Changed 2 years ago by joehave
Here's an example of what I believe is the same issue. http://jsfiddle.net/Yuuws/3/
comment:3 Changed 10 months ago by Luis Dalmolin
- Status changed from new to closed
- Resolution set to fixed
Datepicker: Fixed position problem when input is in a fixed element. Fixes #5626 - DatePicker doesn't work inside fixed div.
Changeset: 147ec7bd624e631fe019973876ad587e85d112bf
comment:4 Changed 10 months ago by Luis Dalmolin
Datepicker: Fixed position problem when input is in a fixed element. Fixes #5626 - DatePicker doesn't work inside fixed div. (cherry picked from commit 147ec7bd624e631fe019973876ad587e85d112bf)
Changeset: 9c1780f640e2c9cbcbca1182989ae511408c04e9


Proposed solution:
_checkOffset: function(inst, offset, isFixed) { var dpWidth = inst.dpDiv.outerWidth(); var dpHeight = inst.dpDiv.outerHeight(); var inputWidth = inst.input ? inst.input.outerWidth() : 0; var inputHeight = inst.input ? inst.input.outerHeight() : 0; var viewWidth = document.documentElement.clientWidth + (isFixed ? 0 : $(document).scrollLeft()); // Here var viewHeight = document.documentElement.clientHeight + (isFixed ? 0 : $(document).scrollTop()); // Here ...