Bootstrap-datepicker: What is the proper way to set datepicker orientation?

Created on 26 Jul 2013  路  6Comments  路  Source: uxsolutions/bootstrap-datepicker

Hi I tried to use the 'orientation' option of the datepicker but it doesn't seem to work.

$(".datepicker").datepicker({
  orientation: "right bottom"
});

Thanks in advance

question

Most helpful comment

Yes, it's backwards! "Bottom" really means "top". Please, please fix this.

All 6 comments

"right bottom" should result in the picker showing upward and to the left from the element (the "tooth" that points to the element should be to the bottom-right of the picker).

That's a bit counter-intuitive, isn't it? The first thing that comes to mind for me is that it's the orientation of the calendar relative to the element, not the element relative to the calendar.

Yes, it's backwards! "Bottom" really means "top". Please, please fix this.

Just stumbled upon this after trying to figure out what's wrong, I agree that it makes more sense for "top" to show the picker, well, on top of the element and not on the bottom.

At the very least the docs should show an example with both code and pictures examples on how to properly use the orientation.

@tineyi it has a duplicate, which is fixed: https://github.com/eternicode/bootstrap-datepicker/issues/1406

it's working ......
$(document).ready(function(){
var date_input=$('input[name="date"]'); //our date input has the name "date"
var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
date_input.datepicker({
format: 'mm/dd/yyyy',
container: container,
todayHighlight: true,
autoclose: true,
orientation: "left top",
})
})

Was this page helpful?
0 / 5 - 0 ratings