Question

a listbox on a webform is being populated by a datasource on a sql server 2008.

depending on the text in the list box i would liek the backgroudn color of that specific item to be a specific color

for example if these are the items in the list:

AA item 1
AA item 2
BB item 3
BB item 4
AA item 5

if the item begins with AA, then make the background green and if the item beings with BB then make it blue

how can i do this?

the solution can be client or server side, doesnt matter to me

i am currenlty doing this:

function colorproblemlist() {
        ob = document.getElementById('lstProblems');
        for (var i = 0; i < ob.options.length; i++) {
            if (ob.options[i].value.indexOf('AA')!=-1) {
                ob.options[i].style.color = "red";
            }
        }

    }

and it’s working great!!

however i have the following complication.

the first column as you see below:

AA item 1
AA item 2
BB item 3
BB item 4
AA item 5

will not be visible

only the second one will be visible:

Item 1
Item 2
...

this column :

AA
AA

..

is a field in the database table from which this data is pulled and i need the color to be based on that field.

how can i do this?>

Answer 1

Something like:

function colorproblemlist() {
    ob = document.getElementById('lstProblems');
    for (var i = 0; i < ob.options.length; i++) {
        var option = ob.options[i];

         switch(option.value.substr(0,2))
         {
            case "AA":
                option.style.color = "Red";
            break;
            case "BB":
                option.style.color = "Green";
            break;
         }

         option.value = option.value.slice(3); //Assumption of 'AA '
    }
}

Based on the removal of the AA, BB flags from the html, modifying the color on the client will no longer be possible.