CODEWITHSUNDEEP
jquerydatepicker
Jilco Tigchelaar
Jilco Tigchelaar

Reputation: 2149

jquery datepicker change position dynamically

I use several datepickers on my page and in some cases i hide a div with one of them. After that the position of the other datepickers is not correct anymore, they are way above the input. I think that is because the place is determined on initialisation, because if i show the div again the position is correct.

But how to make the position that it changes if an other datepicker (div) hides?

Upvotes: 1

Views: 7160

Answers (2)

TigOldBitties
TigOldBitties

Reputation: 1337

Adding another answer because the accepted answer did not work for me because I am using 1.7 and maybe someone else will find this useful.

Can be done by using _checkOffset method to alter as needed

$.datepicker._checkOffset_original = $.datepicker._checkOffset;
$.datepicker._checkOffset = function(inst, offset, isFixed) {
    var offset = $.datepicker._checkOffset_original(inst, offset, isFixed);
    var alterOffset = this._get(inst, 'alterOffset');
    if (alterOffset)
        return alterOffset.apply((inst.input ? inst.input[0] : null), [offset]);  // trigger custom callback
        return offset;
    }

and setting on the datepicker the wanted callback

$('#id').datepicker('option', 'alterOffset', function(offset){
    //change offset here
    return offset;
});

Upvotes: 0

Malk
Malk

Reputation: 11983

Perhaps set the position in the beforeShow event:

$(".is-datepicker").datepicker("option", "beforeShow", function(input, inst){
   $(inst.dpDiv).position({
      my: "left top",
      at: "left bottom",
      of: $(input)
 });

position() was added in version 1.8 http://api.jqueryui.com/position/

jsfiddle

Upvotes: 3

Related Questions