Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Alex's solution was nice, but it didn't work well if you tried to resize window down. The problem was that jquery ui is trying to calculate position of widget, so that it never gets out of view. The thing is it doesn't work well with Alex's solution. I changed source code (which is not very nice, but only solution I came up with) to achieve the result. Here's the function on line 3960 that I changed:</p> <pre><code>/* Check positioning to remain on screen. */ _checkOffset: function(inst, offset, isFixed) { // CHANGED This way I can add class date-right to the input to make it right aligned var isRightAlign = inst.input.hasClass('date-right'); var dpWidth = inst.dpDiv.outerWidth(); var dpHeight = inst.dpDiv.outerHeight(); var inputWidth = inst.input ? inst.input.outerWidth() : 0; var inputHeight = inst.input ? inst.input.outerHeight() : 0; var viewWidth = document.documentElement.clientWidth + (isFixed ? 0 : $(document).scrollLeft()); var viewHeight = document.documentElement.clientHeight + (isFixed ? 0 : $(document).scrollTop()); // CHANGED Alex's solution is implemented on the next line (just add || isRightAlign) offset.left -= (this._get(inst, 'isRTL') || isRightAlign ? (dpWidth - inputWidth) : 0); offset.left -= (isFixed &amp;&amp; offset.left == inst.input.offset().left) ? $(document).scrollLeft() : 0; offset.top -= (isFixed &amp;&amp; offset.top == (inst.input.offset().top + inputHeight)) ? $(document).scrollTop() : 0; // CHANGED Do not check if datepicker is outside of the viewport if it's right aligned if(!isRightAlign){ // now check if datepicker is showing outside window viewport - move to a better place if so. offset.left -= Math.min(offset.left, (offset.left + dpWidth &gt; viewWidth &amp;&amp; viewWidth &gt; dpWidth) ? Math.abs(offset.left + dpWidth - viewWidth) : 0); } offset.top -= Math.min(offset.top, (offset.top + dpHeight &gt; viewHeight &amp;&amp; viewHeight &gt; dpHeight) ? Math.abs(dpHeight + inputHeight) : 0); return offset; }, </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload