jquery-uijquery-ui-datepicker

getting jQuery UI's datepicker to always open in a certain direction?


I'm using jQuery UI's datepicker control in a position: fixed toolbar at the bottom of my page. Occasionally, on random computers, the datepicker appears below the toolbar, which means it's off the page and impossible to view or interact with.

Is there a way to force the positioning of the datepicker control to always be above and to the right of its <input>?


Solution

  • You could change the lines:

    offset.left -= (offset.left + dpWidth > viewWidth && viewWidth > dpWidth) ? Math.abs(offset.left + dpWidth - viewWidth) : 0;
    offset.top -= (offset.top + dpHeight > viewHeight && viewHeight > dpHeight) ? Math.abs(offset.top + dpHeight + inputHeight*2 - viewHeight) : 0;
    

    ...to read:

    offset.left = $(inst.input).position().left + dpWidth;
    offset.top = $(inst.input).position().top - dpHeight;
    

    This loses flexibility, though. If your input happens to be at the top of the page, you'll have the opposite problem from before.