Question

sql server 2008上的数据源正在填充webform上的列表框。

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

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

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

如果该项目以AA开头，则设置后台green，如果项目为BB，则将其设为blue

我该怎么做？

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

我当前正在这样做：

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

    }

它工作得很好!!

然而，我有以下并发症。

如下所示的第一列：

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

将不可见

只有第二个可见：

Item 1
Item 2
...

这一栏：

AA
AA

...

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

我该怎么做？＆gt;

Answer 1

服务器端方法：

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

DataBound事件的处理如下：

protected void prevSubList_DataBound(object sender, EventArgs e)
{
     foreach (ListItem item in prevSubList.Items)
     {
         if (item.Text.Contains("AA"))
            item.Attributes.Add("style","background-color:green;");
         else if(item.Text.Contains("BB"))
            item.Attributes.Add("style", "background-color:blue;");
     }
}

Answer 2

类似的东西：

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

基于从html中移除AA，BB标志，将无法再修改客户端上的颜色。

Answer 3

由于控制颜色的数据不属于listitem，因此您必须先手动添加项目并为其添加颜色。

ASPX页面：

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

代码隐藏（我只使用了一个字符串数组及其长度来测试它，你的逻辑会有所不同）：

private string[] testData = new string[] { "Alpha", "Beta", "Gamma", "Delta", "Eta", "Theta", "Zeta", "Iota" };

protected void TestListBoxOnLoad(object sender, EventArgs e)
{
    foreach (var data in testData)
    {
        ListItem item = new ListItem()
        {
            Text = data
        };

        if (data.Length < 5)
        {
            item.Attributes.Add("class", "aaStyle");
        }
        else
        {
            item.Attributes.Add("class", "bbStyle");
        }

        testListBox.Items.Add(item);
    }
}

Answer 4

我不知道这是否违反asp .net mvc的规则，但我为解决类似问题所做的是不使用@Html.ListBoxFor。

我检查@Html.ListBoxFor添加到html的内容并手动进行验证。

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

这是我的情况：

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

asp.net：更改列表框项目的颜色

4 个答案: