Jquery datepicker shows at under the test field. Some time it will top of text field. But I want show the datepicker always in top of the test field. How to do it?
The following code will position the calendar always on top of input field.
$('.txtDate').datepicker({
beforeShow: function (textbox, instance) {
var txtBoxOffset = $(this).offset();
var top = txtBoxOffset.top;
var left = txtBoxOffset.left;
var textBoxWidth = $(this).outerWidth();
console.log('top: ' + top + 'left: ' + left);
setTimeout(function () {
instance.dpDiv.css({
top: top-190, //you can adjust this value accordingly
left: left + textBoxWidth//show at the end of textBox
});
}, 0);
}});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With