Question

I’ve installed Datepicker for Bootstrap and its working nicely. But I can’t figure out how to use the place method to position the datepicker above the element instead of below. I’m guessing it works similiar to the bootstrap popovers, but I haven’t been able to figure it out.

Any suggestions?

Answer 1

The place function just auto places the date picker under your input box. Its not a function that lets you select where you want to place it.

However you can easily override the default functionality of that function with your own custom placement.

Here is an example of that http://jsfiddle.net/G7sWL/19/

All i did copy the original function and add an additional vertical offset of 10 and horizontal offset of 50.

$(function() {
    var picker = $('.datepicker').datepicker();
    var widget = picker.data('datepicker');
    widget.place = function(){  //the original place function
        var offset = this.component ? this.component.offset() : this.element.offset();
        this.picker.css({
            top: offset.top + this.height + 10,  // change #1 = added "+10"
            left: offset.left +50                // change #2 = added "+50"
        });
    }
});