Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > ASP .Net > ASP .Net Web Controls > DropDownList - Programmatically setting the background colour of i

Reply
Thread Tools

DropDownList - Programmatically setting the background colour of i

 
 
Mike Owen
Guest
Posts: n/a
 
      05-04-2005
I have a DropDownList box that I assign values from as follows:

drpColor.DataSource = myVariancecolor
drpColor.DataBind()

Where myVariancecolor is an ArrayList. This works fine and a list of my
colours is shown in the drop down.

I would now like to take this one stage further and actually change the
background colour of each option to be that of the colour.

Once the control is rendered as HTML in the browser, this can be done for
the colour RED for example by manually changing the code for a particular
colour option from:

<option value="11071">Red</option>

To:

<option value="11071" style="COLOR: black; BACKGROUND-COLOR:
Red">Red</option>

Has anyone got any idea how or if this 'BACKGROUND-COLOR' style value can be
changed programmatically for all colours in the list?

If not is there a better way of doing it without having to write the code to
build the HTML for the drop down from scratch?


Thanks, Mike.
 
Reply With Quote
 
 
 
 
Josh
Guest
Posts: n/a
 
      05-04-2005
You should be able to use
ListItem li = ddlList.Items[0];

li.Attributes.CssStyle.Add("background-color","Red");

But you cant because of a known bug. However if you have the know-how you
can use javascript to do this for you on the client


 
Reply With Quote
 
 
 
 
Munsifali Rashid
Guest
Posts: n/a
 
      05-04-2005
Here's some Javascript to do this...


<form>
<select name="colors">
<option value="111">Red</option>
<option value="222">Blue</option>
<option value="333">Green</option>
<option value="444">Yellow</option>
</select>
</form>

<script language="Javascript">
<!--
// Get the form
var f = document.forms[0];

// Get the dropdown
var e = f.elements[0];

// Iterate through the items in the dropdown
for (var i=0; i < e.options.length; i++)
{
// Get the item
var item = e.options[i];

// Get the color
var text = item.text;

// Set the background color property
item.style.backgroundColor = text;
}
//-->
</script>


Hope this helps,

Mun

--
Munsifali Rashid
http://www.munit.co.uk/blog/



"Josh" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> You should be able to use
> ListItem li = ddlList.Items[0];
>
> li.Attributes.CssStyle.Add("background-color","Red");
>
> But you cant because of a known bug. However if you have the know-how you
> can use javascript to do this for you on the client
>
>



 
Reply With Quote
 
Mike Owen
Guest
Posts: n/a
 
      05-05-2005
Thanks for your replies guys.

Unfortunately the setting of the colours has to be done server side as some
of the colours do not directly match their text, e.g. Airforce Blue = #6699FF

The Attributes.CssStyle.Add would have been perfect.

Any other suggestions?


"Munsifali Rashid" wrote:

> Here's some Javascript to do this...
>
>
> <form>
> <select name="colors">
> <option value="111">Red</option>
> <option value="222">Blue</option>
> <option value="333">Green</option>
> <option value="444">Yellow</option>
> </select>
> </form>
>
> <script language="Javascript">
> <!--
> // Get the form
> var f = document.forms[0];
>
> // Get the dropdown
> var e = f.elements[0];
>
> // Iterate through the items in the dropdown
> for (var i=0; i < e.options.length; i++)
> {
> // Get the item
> var item = e.options[i];
>
> // Get the color
> var text = item.text;
>
> // Set the background color property
> item.style.backgroundColor = text;
> }
> //-->
> </script>
>
>
> Hope this helps,
>
> Mun
>
> --
> Munsifali Rashid
> http://www.munit.co.uk/blog/
>
>
>
> "Josh" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
> > You should be able to use
> > ListItem li = ddlList.Items[0];
> >
> > li.Attributes.CssStyle.Add("background-color","Red");
> >
> > But you cant because of a known bug. However if you have the know-how you
> > can use javascript to do this for you on the client
> >
> >

>
>
>

 
Reply With Quote
 
Mike Owen
Guest
Posts: n/a
 
      05-05-2005
I have just found a possible solution to the problem suggested elsewhere:

.....use an html control and make it runat="server".
So use,
<SELECT id="listBox1" size="20" runat="server"></SELECT>and add color
attribute for each item..


Cheers, Mike.


"Mike Owen" wrote:

> Thanks for your replies guys.
>
> Unfortunately the setting of the colours has to be done server side as some
> of the colours do not directly match their text, e.g. Airforce Blue = #6699FF
>
> The Attributes.CssStyle.Add would have been perfect.
>
> Any other suggestions?
>
>
> "Munsifali Rashid" wrote:
>
> > Here's some Javascript to do this...
> >
> >
> > <form>
> > <select name="colors">
> > <option value="111">Red</option>
> > <option value="222">Blue</option>
> > <option value="333">Green</option>
> > <option value="444">Yellow</option>
> > </select>
> > </form>
> >
> > <script language="Javascript">
> > <!--
> > // Get the form
> > var f = document.forms[0];
> >
> > // Get the dropdown
> > var e = f.elements[0];
> >
> > // Iterate through the items in the dropdown
> > for (var i=0; i < e.options.length; i++)
> > {
> > // Get the item
> > var item = e.options[i];
> >
> > // Get the color
> > var text = item.text;
> >
> > // Set the background color property
> > item.style.backgroundColor = text;
> > }
> > //-->
> > </script>
> >
> >
> > Hope this helps,
> >
> > Mun
> >
> > --
> > Munsifali Rashid
> > http://www.munit.co.uk/blog/
> >
> >
> >
> > "Josh" <(E-Mail Removed)> wrote in message
> > news:(E-Mail Removed)...
> > > You should be able to use
> > > ListItem li = ddlList.Items[0];
> > >
> > > li.Attributes.CssStyle.Add("background-color","Red");
> > >
> > > But you cant because of a known bug. However if you have the know-how you
> > > can use javascript to do this for you on the client
> > >
> > >

> >
> >
> >

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
What is the point of having 16 bit colour if a computer monitor can only display 8 bit colour? How do you edit 16 bit colour when you can only see 8 bit? Scotius Digital Photography 6 07-13-2010 03:33 AM
Getting default colour for <input> - or just the old colour jodleren Javascript 2 01-12-2008 02:57 PM
Setting background colour of JFrame Scott Steiner Java 1 05-05-2005 10:48 AM
Colour blindness, photography and colour management Tor Lillqvist Digital Photography 12 05-24-2004 08:57 AM
changing a background image to a background colour? Dj Frenzy Javascript 3 02-10-2004 08:08 PM



Advertisments