search

ng2-ui / datetime-picker

Angular2 DateTime Picker
https://ng2-ui.github.io/#/datetime-picker
MIT License
121 stars 62 forks source link

Dropdown goes beyond right edge of the page when input close to right edge #218

Open k4G17eYWI opened 6 years ago

k4G17eYWI commented 6 years ago

Here an example: image

billublack commented 6 years ago

A more or less similar issue I am facing here. Popup is overlapping the input field when input is located at the end of the page. image

billublack commented 6 years ago

Fixed the above problem. In ng2-datetime-picker.directive.ts file, change this condition:

if (thisElBcr.bottom + ng2DatetimePickerElBcr.height > window.innerHeight) { this.ng2DatetimePickerEl.style.bottom = (thisElBcr.bottom - window.innerHeight + 15) + 'px'; }

to this:

if (thisElBcr.bottom + ng2DatetimePickerElBcr.height > window.innerHeight) { this.ng2DatetimePickerEl.style.top = (thisElBcr.top - ng2DatetimePickerElBcr.bottom + thisElBcr.height) + 'px'; }

It will look like:

image