Change the color of a Webgrid mvc <td> tag

Asked

Viewed 468 times

1

That’s the WebGrid and I need to change the background color of Celula filled in "IN PROCESSING": for Red:

inserir a descrição da imagem aqui

CSS

<style type="text/css">
    .grid {
        margin: 4px;
        border-collapse: collapse;
        width: 100%;
    }

    .head {
        background-color: #E8E8E8;
        font-weight: bold;
        color: #FFF;
    }

    .grid th, .grid td {
        border: 1px solid #C0C0C0;
        padding: 5px;
    }

    .alt {
        background-color: #E8E8E8;
        color: #000;
    }
</style>

I mount the Webgrid columns like this in code behid:

List<WebGridColumn> columns = new List<WebGridColumn>();
foreach (DataColumn col in dt.Columns)
{
    columns.Add(new WebGridColumn()
    {
        ColumnName = col.ColumnName,
        Header = col.ColumnName,
        Format = (item) =>
        {
            if (valor == "EM PROCESSAMENTO")                                        
            {
                return new HtmlString("<font color='blue'><b>EM PROCESSAMENTO</b></font>"); //Pintar o fundo da Celula em vermelho.
            }                                
        }
    });
});

1 answer

1

I believe it is enough to define a CSS rule:

.grid td.em-processamento {
    background-color: red;
}

And use this class in the Datacolumn Style property:

List<WebGridColumn> columns = new List<WebGridColumn>();
foreach (DataColumn col in dt.Columns)
{
    columns.Add(new WebGridColumn()
    {
        ColumnName = col.ColumnName,
        Header = col.ColumnName,
        Format = (item) =>
        {
            if (valor == "EM PROCESSAMENTO")                                        
            {
                return new HtmlString("<font color='blue'><b>EM PROCESSAMENTO</b></font>"); //Pintar o fundo da Celula em vermelho.
            }                                
        },
        Style = (valor == "EM PROCESSAMENTO") ? "em-processamento" : "";
    });
});

Browser other questions tagged

You are not signed in. Login or sign up in order to post.