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

Features

Installation

PM> install-package HtmlTableHelper

dotnet add package HtmlTableHelper

Fiddle Demo:

Get Start

List/Array/Set/Enumrable non Key/Value Type Example

using HtmlTableHelper;
..
var sourceData = new[] { new { Name = "ITWeiHan", Age = "25",Gender = "M" } };
var tablehtml = sourceData.ToHtmlTable();
/*
Result:
<table><thead><tr><th>Name</th><th>Age</th><th>Gender</th></tr></thead><tbody><tr><td>ITWeiHan</td><td>25</td><td>M</td></tr></tbody></table>
*/

Dapper Example

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

Dictionary Example

var sourceData = new[] {new Dictionary<string, object> (){{"Name" , "ITWeiHan" },{"Age",25},{"Gender","M"}}};
var tablehtml = sourceData.ToHtmlTable();

var data = /*List/Array/Set/Enumrable..*/;
var html = data.ToHtmlTable( tableAttributes: new { @class = "SomeClass"} //this is dynamic type, support all attribute 
 ,trAttributes: new { ID = "SomeID" },tdAttributes: new { width = "120 px" },thAttributes: new { @class = "dark-theme" }
);
/*
Result:
<table class="SomeClass">
	<thead>
		<tr ID="SomeID">
			<th class="dark-theme">..</th>
		</tr>
	</thead>
	<tbody>
		<tr ID="SomeID">
			<td width="120 px">..</td>
		</tr>
	</tbody>
</table>
*/

Attribute Annotation

1. Display :

public class ModelClassWithDisplayAttr
{
 [TableColumn(DisplayName = "Column1")] //MyProperty1 property will render thead-td's innertext : "Column1"
 public string MyProperty1 { get; set; }
 [TableColumn(DisplayName = "Column2")] //MyProperty2 property will render thead-td's innertext : "Column2"
 public string MyProperty2 { get; set; }
}

2. Skip :

public class ModelClassWithSkipAttr
{
 [TableColumn( Skip = true)]
 public string MyProperty1 { get; set; } //MyProperty1 will not render html
 public string MyProperty2 { get; set; }
}

HTMLTableBuilder

HtmlCaption

var soucreData = new []{ new {MyProperty1="test",MyProperty2=123} };
var html = soucreData.CreateBuilder()
 .SetCaption("This is Caption", new { id = "CaptionId" })
 .ToHtmlTable();
//Result : <table><caption id=\"CaptionId\" >This is Caption</caption><thead><tr><th>MyProperty1</th><th>MyProperty2</th></tr></thead><tbody><tr><td>test</td><td>123</td></tr></tbody></table>

HTMLTableSetting

var sourceData = new[] { new { Name = "<b>ITWeiHan</b>" } };
//Default Encoding
var encodinghtml = sourceData.ToHtmlTable();
//Result: <table>..&lt;b&gt;ITWeiHan&lt;/b&gt;..</table>
var htmltablesetting = new HTMLTableSetting()
{
 IsHtmlEncodeMode = false
};
var notEncodinghtml = sourceData.ToHtmlTable(HTMLTableSetting: htmltablesetting);
//Result: <table>..<b>ITWeiHan</b>..</table>

Extension

using System.Collections.Generic;
using HtmlTableHelper;
using Microsoft.AspNetCore.Mvc.Rendering;
using Microsoft.AspNetCore.Html;
public static class IHtmlHelperExtension
{
 public static HtmlString ToHtmlTable<T>(this IHtmlHelper htmlHelper, IEnumerable<T> 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<T>(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);
 }
}

@Html.ToHtmlTable(new[] { new { Name = "ITWeiHan", Age = "25", Gender = "M" } })
/*
Result:<table><thead><tr><th>Name</th><th>Age</th><th>Gender</th></tr></thead><tbody><tr><td>ITWeiHan</td><td>25</td><td>M</td></tr></tbody></table>
*/

using System.Collections.Generic;
using HtmlTableHelper;
using System.Web;
using System.Web.Mvc;
public static class HtmlHelperExtension
{
 public static HtmlString ToHtmlTable<T>(this HtmlHelper htmlHelper, IEnumerable<T> 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<T>(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);
 }
}

Demo

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();
 }
}

@{
 Layout = null;
}
<!DOCTYPE html>
<html>
<head>
 <meta name="viewport" content="width=device-width" />
 <title>AspNetMvcDemo</title>
 <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet" />
</head>
<body>
 <div>
 @Html.Raw(ViewBag.Table)
 </div>
 <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
 <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
 <script>
 $(document).ready(function () {
 $('Table').DataTable();
 });
 </script>
</body>
</html>

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);
 });
 }
}