Quick Info Popup is offscreen when an appointment is on the bottom

[Shuaib Solker]

Hello,

I am having an issue where if I open the quick info popup on an appointment that is at the bottom of the screen, some of the information gets cut off.

Then when I try to scroll up it either kicks me to the top of the schedule or if the appointment is high enough it shows the whole popup.

I attached a stackblitz which I got from your demos that it occurs with as well.

I also attached a GIF of the behaviour.

https://stackblitz.com/edit/syncfusion-angular-scheduler-quickinfotemplate-off-screen?file=app.component.html

What do I need to change so that the whole pop up shows when at the bottom of the schedule.

Thank you for the help!

Attachment: syncfusionangularschedulerquickinfotemplateoffscreen_2e356c8a.zip

[Ravikumar Venkatesan]

Hi Shuaib, 

Greetings from Syncfusion support. 

We have validated your reported query “Quick Info Popup is offscreen when an appointment is on the bottom” at our end and resolved it with the help of the refreshPosition method of the EJ2 Angular popup for the same we have modified your shared sample which can be available from the below link. 

Sample: https://stackblitz.com/edit/syncfusion-angular-scheduler-quickinfotemplate-off-scree-l1psr6?file=app.component.ts 

[app.component.html] 

<ejs-schedule #scheduleObj cssClass='schedule-overview' (eventClick)="onClick($event)"> </ejs-schedule> 

[app.component.ts] 

  public eventAdded: boolean = false; 

 

  public onClick(args) { 

    if (!this.eventAdded) { 

      let popupInstance = (document.querySelector(".e-quick-popup-wrapper") as any).ej2_instances[0]; 

      popupInstance.open = () => { 

        popupInstance.refreshPosition(); 

      }; 

      this.eventAdded = true; 

    } 

  } 

API(refreshPosition method): https://ej2.syncfusion.com/angular/documentation/api/dialog#refreshposition 

 

Kindly try the above sample and get back to us if you need any further assistance. 

Regards, 

Ravikumar Venkatesan 

[Shuaib Solker]

Hi Ravikumar,

Okay yeah that worked.

Thank you for the help!

[Nevitha Ravi]

Hi Shuaib, 

You are most welcome..! we are glad that our provided solution worked at your end. Please let us know if you need any further assistance. 

Regards, 

Nevitha