How to add icon or image in Raddropdownlist ?

[Aravind]

Hai,
   How to add icon or image on right side of the raddropdowlist  ?
   I am dynamically added dropdowlist via code and i need to add icon on right side of the control  (inside the control) ,In textbox i can add, like this i want to add icon, here i attach screenshot.

Thanks and Regards
Aravind

[Aravind]

Hai, any reply on this i want to show icon on right side of the dropdown list for

1. If dropdown list is empty
2,if dropdown list have value like "Yes" and "No", if user selected "No", then need to show icon in right side with that value (NO)

[Dess | Tech Support Engineer, Principal]

Hello, Aravind,

I have prepared a sample code snippet for your reference which result is illustrated in the below screenshot: 

            RadListDataItem item1 = new RadListDataItem();
            item1.Image = Properties.Resources.ok;
            item1.Text = "Yes";

            RadListDataItem item2 = new RadListDataItem();
            item2.Image = Properties.Resources.cancel;
            item2.Text = "No"; ;
            this.radDropDownList1.Items.Add(item1);
            this.radDropDownList1.Items.Add(item2);

            this.radDropDownList1.DropDownStyle = RadDropDownStyle.DropDownList;
            this.radDropDownList1.ShowImageInEditorArea = true;
            this.radDropDownList1.DropDownListElement.EditableElement.TextImageRelation = TextImageRelation.TextBeforeImage;
            this.radDropDownList1.DropDownListElement.EditableElement.ImageAlignment = ContentAlignment.MiddleRight;

I hope this information helps. If you need any further assistance please don't hesitate to contact me. 

Regards,
Dess | Tech Support Engineer, Principal
Progress Telerik

[Aravind]

Hi, Thanks for reply ,
1 .Icon need to add when ddl is empty also, i mean ddl got items, but not select any item, that time need to show error icon like  validation .Below the screenshot what i want


2. Need to show icon on right side of text when select "No" , and not in the list added, below the screenshot what i want

3. Icon not showed when i select item programmatically, i mean i added icon in the list , but when select item "No" via code, icon not appear, below the screenshot

when i click dropdown list then only icon appear.

I want to show icon when select the "No" via code.

 

Regards
Aravind

 

[Dess | Tech Support Engineer, Principal]

Hi, Aravind,

Thank you for the additional screenshots and details.

1. If you need to show an icon when no item is selected, it is appropriate to handle the SelectedIndexChanged event and set the DropDownListElement.EditableElement.Image:

        private void radDropDownList1_SelectedIndexChanged(object sender, Telerik.WinControls.UI.Data.PositionChangedEventArgs e)
        {
            if (e.Position==-1)
            {
                this.radDropDownList1.DropDownListElement.EditableElement.Image = Properties.Resources.warning;
            }
        }

Then, you can reset the Image when a real item is selected.

2. It is possible to eliminate the image in the popup items by handling the VisualListItemFormatting event: 

        private void radDropDownList1_VisualListItemFormatting(object sender, VisualItemFormattingEventArgs args)
        {
            args.VisualItem.DrawImage = false;
        }

3. If the RadListDataItem is added with specified Image property, once this item is selected (no matter if programmatically or by the UI), the respective image is expected to be shown. Please refer to the attached sample project that I have prepared for your reference.

Please give it a try and see how it works on your end.