Web Analytics

HtmlTableHelper

⭐ 42 stars Simplified Chinese by mini-software

NuGet


version version version version version version version version version version version version version version version version version


功能特性

安装

你可以使用 Visual Studio 包管理器或 NuGet UI 从 NuGet 安装该包

PM> install-package HtmlTableHelper

或使用 dotnet 命令行:

dotnet add package HtmlTableHelper

Fiddle 演示:

快速开始

##### List/Array/Set/Enumrable 非键值类型示例 ``C# using HtmlTableHelper; .. var sourceData = new[] { new { Name = "ITWeiHan", Age = "25",Gender = "M" } }; var tablehtml = sourceData.ToHtmlTable(); /* 结果:

NameAgeGender
ITWeiHan25M
*/

##### Dapper 示例
C# using (var cn = "Your Connection") { var sourceData = cn.Query(@"select 'ITWeiHan' Name,25 Age,'M' Gender"); var tablehtml = sourceData.ToHtmlTable(); }

##### Dictionary 示例 
C# var sourceData = new[] {new Dictionary (){{"Name" , "ITWeiHan" },{"Age",25},{"Gender","M"}}}; var tablehtml = sourceData.ToHtmlTable();

自定义 Table/TR/TD/TH 属性(动态类型)

C# var data = /List/Array/Set/Enumrable../; var html = data.ToHtmlTable( tableAttributes: new { @class = "SomeClass"} //此处为动态类型,支持所有属性 ,trAttributes: new { ID = "SomeID" },tdAttributes: new { width = "120 px" },thAttributes: new { @class = "dark-theme" } ); /* 结果:
..
..
*/

##### 属性注解

###### 1. Display :

C# public class ModelClassWithDisplayAttr { [TableColumn(DisplayName = "Column1")] //MyProperty1 属性将渲染 thead-td 的 innertext : "Column1" public string MyProperty1 { get; set; } [TableColumn(DisplayName = "Column2")] //MyProperty2 属性将渲染 thead-td 的 innertext : "Column2" public string MyProperty2 { get; set; } }

###### 2. 跳过(Skip): 
C# public class ModelClassWithSkipAttr { [TableColumn( Skip = true)] public string MyProperty1 { get; set; } //MyProperty1 不会渲染为 html public string MyProperty2 { get; set; } }

##### HTMLTableBuilder

###### HtmlCaption

C# var soucreData = new []{ new {MyProperty1="test",MyProperty2=123} }; var html = soucreData.CreateBuilder() .SetCaption("This is Caption", new { id = "CaptionId" }) .ToHtmlTable(); //结果 :
This is Caption
MyProperty1MyProperty2
test123

##### HTMLTableSetting

可配置的 InnerHtml 编码(不建议无特殊原因关闭此功能,因为存在 XSS 攻击风险)

C# var sourceData = new[] { new { Name = "ITWeiHan" } };

//默认编码 var encodinghtml = sourceData.ToHtmlTable(); //结果:

..<b>ITWeiHan</b>..

var htmltablesetting = new HTMLTableSetting() { IsHtmlEncodeMode = false }; var notEncodinghtml = sourceData.ToHtmlTable(HTMLTableSetting: htmltablesetting); //结果:

..ITWeiHan..

扩展

ASP.NET Core MVC: 创建 IHtmlHelperExtension.cs
C# using System.Collections.Generic; using HtmlTableHelper; using Microsoft.AspNetCore.Mvc.Rendering; using Microsoft.AspNetCore.Html;

public static class IHtmlHelperExtension { public static HtmlString ToHtmlTable(this IHtmlHelper htmlHelper, IEnumerable enums , object tableAttributes = null, object trAttributes = null, object tdAttributes = null , HtmlTableSetting HTMLTableSetting = null) { var html = enums.ToHtmlTable(tableAttributes, trAttributes, tdAttributes, HTMLTableSetting); return new HtmlString(html); }

public static HtmlString ToHtmlTable(this IHtmlHelper htmlHelper, System.Data.DataTable datatable , object tableAttributes = null, object trAttributes = null, object tdAttributes = null , HtmlTableSetting HTMLTableSetting = null) { var html = datatable.ToHtmlTable(tableAttributes, trAttributes, tdAttributes, HTMLTableSetting); return new HtmlString(html); } }


razor.cshtml 
C# @Html.ToHtmlTable(new[] { new { Name = "ITWeiHan", Age = "25", Gender = "M" } }) /* 结果:
NameAgeGender
ITWeiHan25M
*/

ASP.NET MVC 5:   
创建 HtmlHelperExtension.cs
C# using System.Collections.Generic; using HtmlTableHelper; using System.Web; using System.Web.Mvc;

public static class HtmlHelperExtension { public static HtmlString ToHtmlTable(this HtmlHelper htmlHelper, IEnumerable enums , object tableAttributes = null, object trAttributes = null, object tdAttributes = null , HtmlTableSetting HTMLTableSetting = null) {

`csharp
var html = enums.ToHtmlTable(tableAttributes, trAttributes, tdAttributes, HTMLTableSetting);
return new HtmlString(html);
}

public static HtmlString ToHtmlTable(this HtmlHelper htmlHelper, System.Data.DataTable datatable , object tableAttributes = null, object trAttributes = null, object tdAttributes = null , HtmlTableSetting HTMLTableSetting = null) { var html = datatable.ToHtmlTable(tableAttributes, trAttributes, tdAttributes, HTMLTableSetting); return new HtmlString(html); } }

示例

ASP.NET MVC 5 JQuery DataTable 示例:
`C# using HtmlTableHelper; //.. public class HomeController : Controller { public ActionResult Index() { var datas = new[] { new { Name = "ITWeiHan", Age = "25",Gender = "M" } }; ViewBag.Table = datas.ToHtmlTable(); return View(); } }
C# @{ Layout = null; }

AspNetMvcDemo

@Html.Raw(ViewBag.Table)

ASP.NET Core 示例:
C# public class Startup { public void Configure(IApplicationBuilder app, IHostingEnvironment env) { app.Run(async (context) => { var sourceData = new[] { new { Name = "ITWeiHan", Age = "25",Gender = "M" } }; var tablehtml = sourceData.ToHtmlTable(); await context.Response.WriteAsync(tablehtml); }); } }


--- Tranlated By Open Ai Tx | Last indexed: 2025-06-30 ---