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

DropDown List

Thread ID:





144293 Apr 29,2019 12:35 PM UTC May 10,2019 10:34 AM UTC Angular - EJ 2 5
Tags: DropDownList
Asked On April 29, 2019 12:35 PM UTC


In Dropdown List if the text in the dropdown list is bigger then, the popup should extend towards LEFT without the text hide .

I need to use mulitple dropdown in the same page/compoment.



Prince Oliver [Syncfusion]
Replied On April 30, 2019 10:03 AM UTC

Hello Sunithra, 

Thank you for contacting us. 

We have checked your requirement to extend the popup size based on the item’s length. You can use the popupWidth property to the change the popup width based on the content length by setting it as auto. The popup will be displayed based text content. Kindly refer to the following code snippet. 

<ejs-dropdownlist id='games' #sample1 [dataSource]='sportsData' [fields]='localFields' [placeholder]='localWaterMark' [popupWidth]=width></ejs-dropdownlist> 

public width: string = 'auto'; 

We have attached a sample for your reference, Please find it in the following location 

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


Replied On April 30, 2019 10:26 AM UTC


Thanks for Reply.

I need to extend towards left not right [right side must be static ].

Thanks in Advance.



Gopi Govindasamy [Syncfusion]
Replied On May 1, 2019 08:42 AM UTC

Hi Sunithra,  

We have checked your reported scenario and we suspect you have used RTL mode for text to display left to right. We have provided “enableRtl”, to enable the property the dropdownlist popup display right to left and right side text content is static. We have prepared test sample for your reference.  

If the above solution not meet your requirement means, we will provide another option to display the tooltip to show the all text. Please find the UG document and sample for your reference.  

Gopi G. 

Replied On May 9, 2019 06:15 AM UTC


Thats working fine but only thing is that icon should come in the left side that is in the beginning.

Thanks in Advance.



Christopher Issac Sunder K [Syncfusion]
Replied On May 10, 2019 10:34 AM UTC

Hi Sunithra, 

To place the icon at the beginning(left side) enable the “enableRtl” property to true. The “enableRTL” is used to display the component content in right to left. So, when we enable the property, icon will appear in left side. Please find the below code snippet, 
<ejs-dropdownlist id='games' #sample1 [dataSource]='sportsData' [fields]='localFields' [placeholder]='localWaterMark' [enableRtl]="true"></ejs-dropdownlist> 

Please find the sample from below link 

If still this issue persists please share the below details that will help us to check and provide the exact solution at our end. 
  1. Provide the Code snippet
  2. Share the issue reproducing sample



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