ASP.NET GridView数据绑定字符串列指定位置字符加粗如何实现
ASP.NET GridView 指定列字符格式化加粗实现方案
该效果在设计模式和源代码中都可以实现,更推荐直接通过源代码编写逻辑,灵活性更高,具体操作方法如下:
方法1:前端数据绑定时直接处理(可在设计器源码视图配置)
你可以直接在 GridView 的 number 列绑定数据时插入字符串处理逻辑,不需要额外写后端事件:
- 首先把 number 列转为模板列:
- 在设计视图右键 GridView,选择「编辑列」,找到 number 列,点击右下角「将此字段转换为 TemplateField」,确定后即可编辑模板
- 打开源码视图,找到该模板列的
ItemTemplate节点,把绑定代码替换为如下逻辑:
<asp:TemplateField HeaderText="number"> <ItemTemplate> <%# FormatNumberString(Eval("number").ToString()) %> </ItemTemplate> </asp:TemplateField>
- 然后在对应的后端 .cs 文件里添加字符串处理的公共方法:
public string FormatNumberString(string numStr) { // 长度不足5位直接返回原内容,可根据需求调整边界逻辑 if (string.IsNullOrEmpty(numStr) || numStr.Length < 5) { return numStr; } // 计算对应字符的索引位置 int fifthFromRightIndex = numStr.Length - 5; int lastThreeStartIndex = numStr.Length - 3; // 拼接带加粗标签的结果 return numStr.Substring(0, fifthFromRightIndex) + "<strong>" + numStr[fifthFromRightIndex] + "</strong>" + numStr.Substring(fifthFromRightIndex + 1, lastThreeStartIndex - (fifthFromRightIndex + 1)) + "<strong>" + numStr.Substring(lastThreeStartIndex) + "</strong>"; }
方法2:通过 RowDataBound 事件后端处理
如果你习惯在后端事件里处理渲染逻辑,可以使用 GridView 的 RowDataBound 事件实现:
- 给 GridView 添加
OnRowDataBound属性绑定事件:
<asp:GridView ID="YourGridViewID" runat="server" OnRowDataBound="YourGridViewID_RowDataBound">
- 后端添加对应事件处理方法:
protected void YourGridViewID_RowDataBound(object sender, GridViewRowEventArgs e) { // 只处理数据行,跳过表头、页脚等行 if (e.Row.RowType == DataControlRowType.DataRow) { // 第一列的索引为0 TableCell numberCell = e.Row.Cells[0]; string numStr = numberCell.Text; if (string.IsNullOrEmpty(numStr) || numStr.Length <5) { return; } int fifthFromRightIndex = numStr.Length -5; int lastThreeStartIndex = numStr.Length -3; numberCell.Text = numStr.Substring(0, fifthFromRightIndex) + "<strong>" + numStr[fifthFromRightIndex] + "</strong>" + numStr.Substring(fifthFromRightIndex + 1, lastThreeStartIndex - (fifthFromRightIndex + 1)) + "<strong>" + numStr.Substring(lastThreeStartIndex) + "</strong>"; } }
注意:如果输出的 strong 标签直接显示为文本没有生效,是因为 ASP.NET 默认对输出内容做了 HTML 编码,你可以将绑定控件的编码属性关闭,或者使用
Html.Raw方法包裹输出内容即可解决。
内容的提问来源于stack exchange,提问作者Cesc
相关产品推荐
相关产品推荐

