on scrolling popup for dropdown appears in top sometime and in bottom sometime

[thowfik]

on scrolling popup for dropdown appears in top sometime and in bottom sometime i need dropdown to appear in the top even in scrolling instead of appearing in bottom

[Prince Oliver]

Hi Thowfik,  

 

Thank you for contacting us. 

 

We have checked the reported scenario. By default, the dropdown will open at the bottom. If there is not enough space to open the popup at the bottom then, the popup will open at the top. This is default behavior of popup components. To open the dropdown at top we suggest you use DropDownList open event, in that you can get the popupHeight and set a negative value into popup offsetY property. Please find the code snippet below 

 

[HTML] 

<ejs-dropdownlist #dropdown id='games' #sample [dataSource]='sportsData' [value]='value' [fields]='fields' 

  [placeholder]='waterMark' [popupHeight]='height' (open)="onddlPopupOpen($event, dropdown)"></ejs-dropdownlist> 

 

[ts] 

onddlPopupOpen(event: PopupEventArgs, ddlObj) { 

  event.popup.offsetY = -(parseInt(ddlObj.popupHeight)); 

  event.popup.collision = { X: 'fit', Y: 'fit' }; 

  event.popup.dataBind(); 

  event.popup.refreshPosition(ddlObj.element, false); 

} 

 

Please find the sample at the following location: 

https://stackblitz.com/edit/angular-lg9vcc-yqwm5x  

 

Let us know if you need any further assistance on this. 

 

Regards, 

Prince