We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

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

Thread ID:





145336 Jun 18,2019 05:56 AM UTC Jun 18,2019 11:28 AM UTC Angular - EJ 2 1
Tags: DropDownList
Asked On June 18, 2019 05:56 AM UTC

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 [Syncfusion]
Replied On June 18, 2019 11:28 AM UTC

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 
<ejs-dropdownlist #dropdown id='games' #sample [dataSource]='sportsData' [value]='value' [fields]='fields' 
  [placeholder]='waterMark' [popupHeight]='height' (open)="onddlPopupOpen($event, dropdown)"></ejs-dropdownlist> 
onddlPopupOpen(event: PopupEventArgs, ddlObj) { 
  event.popup.offsetY = -(parseInt(ddlObj.popupHeight)); 
  event.popup.collision = { X: 'fit', Y: 'fit' }; 
  event.popup.refreshPosition(ddlObj.element, false); 
Please find the sample at the following location: 
Let us know if you need any further assistance on this. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon