Bootstrap datepicker orientation/placement

Question

I have a text field with an attached datepicker placed at the bottom of the page. My problem is that the datepicker appears below the text field.

Consequently, it appears outside the window. I Googled and found that apparently I can fix this with some orientation property:

$('#dp2').datepicker({      orientation: 'auto top' }); 

but this had no effect. Anyone have an idea how can I achieve this?

Answer 1

After some struggle found the required solution

at Datepicker Link, just click the Download Development and get latest JS which include the orientation options. In the JS given defaults are:

var defaults = $.fn.datepicker.defaults = {     autoclose: true,     beforeShowDay: $.noop,     calendarWeeks: false,     clearBtn: false,     daysOfWeekDisabled: [],     endDate: Infinity,     forceParse: true,     format: 'mm/dd/yyyy',     keyboardNavigation: true,     language: 'en',     minViewMode: 0,     orientation: "auto",     rtl: false,     startDate: -Infinity,     startView: 2,     todayBtn: false,     todayHighlight: false,     weekStart: 0 }; 

I just use the default :

orientation: "auto", 

there are more options available for orientation.