This is a migrated thread and some comments may be shown as answers.

Changing background color of DropDownList in client-side code

1 Answer 134 Views
FormDecorator
This is a migrated thread and some comments may be shown as answers.
Justin
Top achievements
Rank 1
Justin asked on 08 Jul 2011, 06:59 PM
Hello. We are using a RadFormDecorator on our pages. What we want to do is that when you change the value of DownDown #1, you change the background color of DropDown #2. We need to do this on the client side to prevent an unnecessary postback.

We cannot figure out how to do this. Here is the code:

var eventType = $get("<%=ddlEventType.ClientID %>");
var moveType = $get("<%=ddlMoveType.ClientID %>");
var decorator = Telerik.Web.UI.RadFormDecorator.getDecoratedElement(moveType);
if (eventType.options[eventType.selectedIndex].text == "foo") {
    decorator.style.backgroundColor = "blue";
}
else {
   decorator.style.backgroundColor = "blue";
}

This code has no effect. Note that when I do Telerik.Web.UI.RadFormDecorator.set_enabled(moveType, false) - the control disables just fine. I just can't get the color changed.

Does anyone know how to do this? Thanks in advance for the help.

1 Answer, 1 is accepted

Sort by
0
Bozhidar
Telerik team
answered on 11 Jul 2011, 12:35 PM
Hi Justin,

For Dropdown decoration background color RadFormDecorator uses spite background image, that`s why just by applying background-color it is not possible to change it.

To do that, you should use custom sprite background image. Attached is ComboSprites.gif how the sprite for Black skin looks like.

You have two options, to create sprite with transparent part for the dorpdown text and to leave just the the borders and arrows. Then, applying background color will be visible through the transparent part of the image. Other option is to create several different sprites with different colors and to change the background image instead background color as you do it with your javascript.

You could find useful the following resources: Creating RadFormDecorator Custom Skin and as it is a older, you could also check Creating RadButton Custom Skin the way of custom skin creation is the same for all skins.

Best wishes,
Bojo
the Telerik team
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
Tags
FormDecorator
Asked by
Justin
Top achievements
Rank 1
Answers by
Bozhidar
Telerik team
Share this question
or