如何根据某些条件突出显示webgrid单元格的背景颜色 [英] How to Highlight the background colour of a webgrid cell depending on some condition

问题描述

我是MVC的新手。请指导我

我正在显示网页。

I am new to MVC. Kindly guide me
I am displaying the webgrid.

View
@model  IEnumerable<GridViewMVC.Models.Employee>

@{
    ViewBag.Title = "Home Page";
    WebGrid grid = new WebGrid(Model);
}


<div>
@grid.GetHtml(
        tableStyle:"GridTable",
        headerStyle :"GridHeader",
        footerStyle :"GridFooter",
        alternatingRowStyle :"GridAlterRow",
        rowStyle:"gridRow",        
        
        columns:grid.Columns(
        grid.Column("Id","Emp Id"),
        grid.Column("Name","Name"),
        grid.Column("Age","Age"),
        grid.Column("Designation","Title"),
        grid.Column("Gender","Gender")
))

</div>

---在模型中声明属性。在控制器中我传递Employee List对象来查看



- 输出以这种方式出现

---in model the properties are declared. And in controller I am passing the Employee List object to view

--output comes in this way

Emp Id   Name           Age   Designation   Gender
1        Anurag         24    SE             Male
2        Mike           31    Lead           Male
3        George         41    GPM            Male

--Now i want to highlight the background color of Age as per this condition.

if age is in between 20 to 30, background color Green
if age is in between 30 to 40, background color Yellow
if age is in between 40 above,background color of that cell will be Red

--How can i achieve this. And how to fetch particular cell[webgrid cell] and change that particular grid cell background-color depending on the condition.

--kindly help me

推荐答案

推荐

如果是webgrid在MVC中，



如何到转换表单元色-取决于-上其值-使用-jquery的 [< a href =http://devpinoy.org/blogs/keithrull/archive/2010/06/09/how-to-change-table-cell-color-depending-on-its-value-using-jquery.aspx target =_ blanktitle =New Window> ^ ]



更新了WebGrid的答案

Refer
In case of webgrid in MVC ,

how-to-change-table-cell-color-depending-on-its-value-using-jquery[^]

Updated the Answer for WebGrid

好的，请参考这篇文章：

http://codeblog.silfversparre.com/2011/11/dynamically-set-row-background-color-in-a-webgrid-depending-on-the-content/ [ ^ ]



-KR

okay, refer this, an awesome article :
http://codeblog.silfversparre.com/2011/11/dynamically-set-row-background-color-in-a-webgrid-depending-on-the-content/[^]

-KR

尝试将此正确放在@ grid.Html（）下面。


@ Scripts.Render（ 〜/ bundles / jquery）



< script type =text / javascript>

Try to put this right under your @grid.Html()

@Scripts.Render("~/bundles/jquery")

<script type="text/javascript">

这篇关于如何根据某些条件突出显示webgrid单元格的背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！