Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Primefaces calendar does not readjust its position on window rotation

I am struggling with a primefaces calendar problem on a webpage rendered on a mobile device (tablet). It seems that the css values calculated by primefaces to show the popup calendar are not recalculated on window rotation (you need to click on it again to recalculate).

Here is an example:

  1. I have my webpage displayed in portrait mode. I clicked the calendar icon and the position of the popup is good: enter image description here

(notice the css with left: 719.406px, calculated by primefaces). Everything OK so far.

  1. Now I rotate to landscape mode: enter image description here

Notice that the popup is no longer near the calendar icon. Also, the css states that, by having the same left value.

  1. In order to get it correct, I need to click anywhere on the screen to close the pop up, then click again on the calendar icon:

enter image description here

The position is now good, with a different and correct value of left: 1061.91px.

How can I make primefaces automatically readjust the css without having to double click each time?

The solution found for me so far was to add a custom value for the right alignment with the screen and override the left one:

.ui-datepicker.ui-widget.ui-widget-content {
  left: auto !important;
  right: 10px; 
}

But the above solution is very specific for this screen and luckily because I always have the calendar button in the right part of the screen, so I can always assume that 10 pixels from the right will look ok.

I also noticed that ui-datepicker-div is a child of body element, so I cannot link it with the button with css.

Any ideas/help of a general solution will be highly appreciated. Primefaces version: 6.2

like image 935
actunderdc Avatar asked Feb 21 '19 09:02

actunderdc


1 Answers

This problem is fixed with Primefaces 7.0.RC3. It was released a week ago. https://mvnrepository.com/artifact/org.primefaces/primefaces/7.0.RC3

like image 116
Mircea-Andrei Albu Avatar answered Nov 02 '22 11:11

Mircea-Andrei Albu