C# asp.net:更改列表框项目的颜色

Web表单上的列表框由sql server 2008上的数据源填充

根据列表框中的文本，我会将特定项目的背景颜色设置为特定颜色

例如，如果这些是列表中的项目：

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

如果项目以

AA

开头，则将背景设置为

绿色

，如果项目以

BB

开头，则将其设置为

蓝色

我该怎么做

解决方案可以是客户端或服务器端，对我来说无关紧要

我现在正在这样做：

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";
            }
        }

    }

将不可见

只有第二个将可见：

Item 1
Item 2
...

本栏：

AA
AA

是数据库表中的一个字段，从中提取数据，我需要基于该字段的颜色

我如何才能做到这一点？>

服务器端方法：

<asp:ListBox ID="prevSubList" runat="server" Height="16px" DataTextField="Key" 
 DataValueField="Value" Width="263px" Rows="1"  
 OnDataBound="prevSubList_DataBound">
</asp:ListBox>

服务器端方法：

<asp:ListBox ID="prevSubList" runat="server" Height="16px" DataTextField="Key" 
 DataValueField="Value" Width="263px" Rows="1"  
 OnDataBound="prevSubList_DataBound">
</asp:ListBox>

比如：

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 '
    }
}

函数colorproblemlist（）{
ob=document.getElementById（'lstProblems'）；
对于（变量i=0；i

从html中删除AA、BB标志后，将无法再修改客户端的颜色。

类似于：

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 '
    }
}

函数colorproblemlist（）{
ob=document.getElementById（'lstProblems'）；
对于（变量i=0；i

---

从html中删除AA、BB标志后，将无法再在客户端上修改颜色。

因为控制颜色的数据不是listitem的一部分，您必须手动添加项目，并在添加之前为其着色

ASPX页面：

<asp:ListBox ID="testListBox" runat="server" 
    onload="TestListBoxOnLoad">
</asp:ListBox>

代码隐藏（我刚刚使用了字符串数组及其长度来测试它，您的逻辑将不同）：

private string[]testData=新字符串[]{“Alpha”、“Beta”、“Gamma”、“Delta”、“Eta”、“Theta”、“Zeta”、“Iota”}；
受保护的void TestListBoxOnLoad（对象发送方，事件参数e）
{
foreach（testData中的var数据）
{
ListItem项目=新建ListItem（）
{
文本=数据
};
如果（数据长度<5）
{
添加（“类别”、“aaStyle”）；
}
其他的
{
添加（“类”、“bbStyle”）；
}
testListBox.Items.Add（item）；
}
}

由于控制颜色的数据不是listitem的一部分，因此您必须手动添加项目，并在添加之前对其进行着色

ASPX页面：

<asp:ListBox ID="testListBox" runat="server" 
    onload="TestListBoxOnLoad">
</asp:ListBox>

代码隐藏（我刚刚使用了字符串数组及其长度来测试它，您的逻辑将不同）：

private string[]testData=新字符串[]{“Alpha”、“Beta”、“Gamma”、“Delta”、“Eta”、“Theta”、“Zeta”、“Iota”}；
受保护的void TestListBoxOnLoad（对象发送方，事件参数e）
{
foreach（testData中的var数据）
{
ListItem项目=新建ListItem（）
{
文本=数据
};
如果（数据长度<5）
{
添加（“类别”、“aaStyle”）；
}
其他的
{
添加（“类”、“bbStyle”）；
}
testListBox.Items.Add（item）；
}
}

我不知道这是否违反了asp.net mvc的规则，但我解决类似问题的方法是不使用

@Html.ListBoxFor

我检查

@Html.ListBoxFor

添加到Html中的内容，并手动进行验证

我想如果我更改列表的名称（在模型中），我将不得不返回到我的代码并手动修改它（可伸缩性和可维护性较差的代码）

这就是我的情况：

<label for="EventsList" style="font-size:.9em" >Evento</label>                  
<select id="EventsList" multiple="multiple" name="Eventos">
    @foreach (var evento in Model.Eventos)
    {
        string style = "";
        switch (evento.Estado)
        {
            case 0:
                style = "background-color:#ff6868";
                break;
            case 1:
                style = "background-color:#ff8355";
                break;
            case 2:
                style = "background-color:#fcfc6a";
                break;
            case 3:
                style = "background-color:#79d779";
                break;
        }
        <option value="@evento.Id" style="@style">@evento.Descripcion</option>
    }
</select>

Evento
@foreach（Model.Eventos中的var evento）
{
字符串样式=”；
开关（evento.Estado）
{
案例0：
style=“背景色：#ff6868”；
打破
案例1：
style=“背景色：#ff8355”；
打破
案例2：
style=“背景色：#fc6a”；
打破
案例3：
style=“背景色：#79d779”；
打破
}
@事件描述
}

我不知道这是否违反了asp.net mvc的规则，但我解决类似问题的方法是不使用

@Html.ListBoxFor

我检查

@Html.ListBoxFor

添加到Html中的内容，并手动进行验证

我想如果我更改列表的名称（在模型中），我将不得不返回到我的代码并手动修改它（可伸缩性和可维护性较差的代码）

这就是我的情况：

<label for="EventsList" style="font-size:.9em" >Evento</label>                  
<select id="EventsList" multiple="multiple" name="Eventos">
    @foreach (var evento in Model.Eventos)
    {
        string style = "";
        switch (evento.Estado)
        {
            case 0:
                style = "background-color:#ff6868";
                break;
            case 1:
                style = "background-color:#ff8355";
                break;
            case 2:
                style = "background-color:#fcfc6a";
                break;
            case 3:
                style = "background-color:#79d779";
                break;
        }
        <option value="@evento.Id" style="@style">@evento.Descripcion</option>
    }
</select>

Evento
@foreach（Model.Eventos中的var evento）
{
字符串样式=”；
开关（evento.Estado）
{
案例0：
style=“背景色：#ff6868”；
打破
案例1：
style=“背景色：#ff8355”；
打破
案例2：
style=“背景色：#fc6a”；
打破
案例3：
style=“背景色：#79d779”；
打破
}
@事件描述
}

如何从

AA

变为

green