Create HTML Table – C#

How to create HTML table using C#

Tables play an important role in effectively communicating information. Therefore, adding tables to HTML documents is a critical aspect and a common requirement in web development. Aspose.HTML for .NET provides a robust solution for developers to manage tables within HTML documents. You can create HTML table, edit the table, add, remove, or extract it from HTML documents. Let’s explore how to work with HTML tables using Aspose.HTML for .NET:

First, make sure you have Aspose.HTML for .NET installed in your project. The installation process of this library is quite simple. Open the NuGet package manager, search for Aspose.HTML, and install. You may also use the following command from the Package Manager Console:

Install-Package Aspose.HTML

HTML <table> Element

HTML tables are used to organize and display data in a structured format, making it easier for users to understand and compare information. When used correctly, HTML tables can improve the readability and accessibility of content on a web page.

You can add tables to HTML documents and to web pages using an HTML <table> element. HTML table consists of one <table> element and one or more <tr>, <th>, and <td> elements that define a table row, table header, and table cell. The <table> element can include global attributes such as style, align, border, width, etc:

<table style="border: 2px #5e5e5e solid" align="center" border="2" width="50%">
    <tbody>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </tbody>
</table>

Add Table to HTML Document using C#

If you want to programmatically create and add table to HTML, see the C# code example below. This code generates an HTML table with 3 rows and 4 columns, fills each cell with content indicating its position, and adds the table to the HTML file:

using Aspose.Html;
using System.IO;
...

    // Create an instance of an HTML document
    using (var document = new HTMLDocument("input.html"))
    {
        var body = document.Body;

        // Create a table element
        var table = (HTMLTableElement)document.CreateElement("table");
        table.Border = "2";
        table.Align = "center";
        table.Style.Border = "2px #ff0000 dotted";
        table.SetAttribute("width", "50%");

        // Add html rows & columns
        for (int i = 0; i < 3; i++)
        {
            var row = (HTMLTableRowElement)table.InsertRow(table.Rows.Length);
            for (int j = 0; j < 4; j++)
            {
                var cell = (HTMLTableCellElement)row.InsertCell(row.Cells.Length);
                cell.TextContent = $"Row: {i + 1}, Column {j + 1}";
            }
        }

        // Attach the table to the document body
        body.AppendChild(table);

        // Save the HTML document to a file
        document.Save("create-html-table.html");
    }

Steps to Create HTML Table

In this example, a new HTML table element is created, attributes are set, and the table is appended to the HTML document. The result is a modified HTML document with the added table:

1. Load an HTML document using one of the HTMLDocument() constructor.
2. Create a new table element using the CreateElement() method.
3. Set attributes for the table, such as border, align, width, and style.
4. Use the InsertRow() and InsertCell() methods to add rows and cells to an HTML table.
5. Use the TextContent property of the Element class to represent the cell’s text content. Whatever value is assigned to this property will be displayed as the cell’s content in the HTML table.
6. Append the new table element to the HTML document. Use the AppendChild() method of the Node class to add the table to the end of the list of children of the document body.
7. Call the Save() method to save the modified HTML document with the added table.

To learn more about Aspose.HTML API, please visit our documentation guide. The Edit HTML Document documentation article gives you basic information on how to read or edit the Document Object Model using Aspose.HTML for .NET API. You will explore how to create HTML elements and how to work with them – modify the document by inserting new nodes, removing, or editing the content of existing nodes.

HTML Table Generator – Online App

Aspose.HTML offers the HTML Table Generator is an online application for creating tables with customizable options. It’s free and clear to use. Just fill in all required options and get a result! The HTML Table Generator automatically creates the HTML table code. This tool was designed to let you get a required HTML table and put it online as quickly as possible.