I have a page which contains two textboxes having jquery datepicker added to them via
function setDatepickers() {
$('.datepicker').datepicker();
$('.datepicker').attr('date', 'date');
}
The page has text boxes in a bottom position and we need to slightly scroll down to see the text boxes. When I am clicking on the textboxes, it opens datepicker, but its at different VERTICAL positions, like sometime a bit above the input textbox, sometime I need to scroll up to see the datepicker. This is happening only in IE8 and not in Firefox. Firefox 3.6.3 is showing it perfect, almost attached to the input textboxes.
Version of jquery used are:
jquery v1.4.1
jquery UI 1.8.5
I tried to get the values from checkoffset method in it, and found the following results:
_checkOffset: function (a, c, d) {
var f = a.dpDiv.outerWidth(),
j = a.dpDiv.outerHeight(),
k = a.input ? a.input.outerWidth() : 0,
l = a.input ? a.input.outerHeight() : 0,
m = document.documentElement.clientWidth + b(document).scrollLeft(),
o = document.documentElement.clientHeight + b(document).scrollTop();
alert(j); alert(k); alert(l); alert(m); alert(o);
c.left -= this._get(a, "isRTL") ? f - k : 0;
c.left -= d && c.left == a.input.offset().left ? b(document).scrollLeft() : 0;
c.top -= d && c.top == a.input.offset().top + l ? b(document).scrollTop() : 0;
c.left -= Math.min(c.left, c.left + f > m && m > f ? Math.abs(c.left + f - m) : 0);
c.top -= Math.min(c.top, c.top + j > o && o > j ? Math.abs(j + l) : 0);
return c
},
The result from alert is:
IE8:
159
135
25
1132
359
Firefox:
159
136
25
1136
843
Final Div comes at:
Firefox:
Top 582
Left 98
IE:
Top 98,
Left 96
I think the Top property is setting incorrectly in IE8, but not sure what needs to be changed to fix this? Any help is greatly appreciated.
Thanks,
Ashish Jain
This bug has been fixed in 1.7.2. Its relative to the border-box model in IE8.
See there for more details: Ticket #5520