【问题标题】:Change color of text in ASP.NET table cell (according to value)更改 ASP.NET 表格单元格中文本的颜色(根据值)
【发布时间】:2016-06-06 09:24:31
【问题描述】:

您能帮我解决这个问题吗: 我正在创建一个包含一些项目及其属性和值的表(在一段时间内)。 看起来像:

我想改变这些值的颜色,假设 0 将是绿色 1 蓝色 2 红色。

DataView dv = new DataView(grid);
myGridView.DataSource = dv;
myGridView.DataBind();

如果我需要更具体,请告诉我,我不是专业人士。我不知道我在哪里可以控制牢房。 我还想在文本上添加鼠标(这样它将显示当前值的发生日期)。 也许一些函数/javascript...?

【问题讨论】:

标签: javascript asp.net colors


【解决方案1】:

使用 jQuery 的非常简单和轻量级的解决方案:

背后的代码:

public partial class GridViewCellColourChange : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if(!Page.IsPostBack)
        {
            gvItems.DataSource = this.GetData();
            gvItems.DataBind();
        }
    }

    private IEnumerable<Item> GetData()
    {
        var item1 = new Item { item = "itm1", prop1 = "23", prop2 = "asd", prop3 = "23d", values = "0-0-0-0-0" };
        var item2 = new Item { item = "itm2", prop1 = "43", prop2 = "asd", prop3 = "23d", values = "0-0-0-0-0" };
        var item3 = new Item { item = "itm3", prop1 = "53", prop2 = "asd", prop3 = "23d", values = "0-0-0-0-0" };

        return new List<Item> { item1, item2, item3 };
    }
}

public class Item
{
    public string item { get; set; }
    public string prop1 { get; set; }
    public string prop2 { get; set; }
    public string prop3 { get; set; }
    public string values { get; set; }
}

.ASPX:

<head runat="server">
    <title></title>
    <script src="https://code.jquery.com/jquery-1.12.2.min.js"></script>
    <script>
        $(function () {  
            $("#gvItems > tbody > tr").each(function (i, row) {
                var children = $(row).children();
                for(var i=0; i < children.length;i++)
                {
                    var child = children[i];
                    if(child.localName == "td")
                    {
                        var text = $(child).text();

                        if(text == "23")
                        {
                            $(child).css("background-color", "red");
                        }
                        else if(text == "43")
                        {
                            $(child).css("background-color", "green");
                        }
                    }
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:GridView ID="gvItems" runat="server"></asp:GridView>
        </div>
    </form>
</body>

输出:

【讨论】:

    【解决方案2】:

    您可以使用带有 OnRowDataBound 属性的 gridview 控件将特定属性绑定到每个单元格/行。

    【讨论】:

    • 感谢您的快速回答。我正在尝试这个,我实际上可以改变整个文本的颜色。我的问题是,我想在一个单元格中使用不同颜色的文本。
    • 为此在 OnRowDataBound 中找到单元格文本并使用..if (e.Row.RowType == DataControlRowType.DataRow) { string cellText = e.Row.Cells[1] .Text.ToString(); }
    【解决方案3】:

    使用OnRowDataBoundgridview的事件,这里是示例

    protected void GridCompany_OnRowDataBound(object sender, GridViewRowEventArgs e)
        {
            foreach (GridViewRow gridViewRow in GridCompany.Rows)
            {
                if (gridViewRow.RowType == DataControlRowType.DataRow)
                {
                    if (gridViewRow.Cells[6].Text.ToUpper() == "TRUE")// find your cell value and check for condition
                    { 
                       // put here your logic
                    }
                    else
                    {
                       // put here your Else logic
                    }
                }
            }
        }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2017-12-27
      • 2018-08-15
      • 2022-11-05
      • 1970-01-01
      • 2014-07-20
      • 2017-04-24
      相关资源
      最近更新 更多