In this article I will explain with an example, how to convert HTML Table to DataTable in ASP.Net using C# and VB.Net.
HTML Table cannot be directly converted to DataTable and hence the values of HTML Table will be converted to JSON format and then using JSON.Net library, the JSON string will be converted to DataTable in ASP.Net using C# and VB.Net.
 
 
Download JSON.Net library
The JSON.Net library is available for download from the following URL.
Download JSON.Net
 
 
HTML Markup
The HTML Markup consists of an HTML Table, a Hidden Field and an ASP.Net Button.
The ASP.Net Button has been assigned an OnClientClick event handler which calls the GetTableValues JavaScript function.
<table cellspacing="0" rules="all" border="1" id="tblCustomers" style="border-collapse: collapse;">
    <tr>
        <th>Customer Id</th>
        <th>Name</th>
        <th>Country</th>
    </tr>
    <tr>
        <td>1</td>
        <td>John Hammond</td>
        <td>United States</td>
    </tr>
    <tr>
        <td>2</td>
        <td>Mudassar Khan</td>
        <td>India</td>
    </tr>
    <tr>
        <td>3</td>
        <td>Suzanne Mathews</td>
        <td>France</td>
    </tr>
    <tr>
        <td>4</td>
        <td>Robert Schidner</td>
        <td>Russia</td>
    </tr>
</table>
<hr />
<input type="hidden" name="CustomerJSON"/>
<asp:Button ID = "btnSubmit" Text="Submit" runat="server" OnClientClick = "GetTableValues()" OnClick ="Submit" />
 
 
JavaScript function to send HTML Table values to Server Side in ASP.Net
When the Submit Button is clicked, the following JavaScript function is called.
A loop is executed over the HTML Table Rows (excluding the Header Row) and the values of each Cell of each Row is copied to a JSON object which is later added to JSON Array.
Finally, the JSON Array is converted into a JSON string and copied to Hidden Field so that its value is sent to ASP.Net Code Behind (Server Side) during Form Submission (PostBack).
<script type="text/javascript" src="https://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>
<script type="text/javascript">
    function GetTableValues() {
        //Create an Array to hold the Table values.
        var customers = new Array();
 
        //Reference the Table.
        var table = document.getElementById("tblCustomers");
 
        //Loop through Table Rows.
        for (var i = 1; i < table.rows.length; i++) {
            //Reference the Table Row.
            var row = table.rows[i];
 
            //Copy values from Table Cell to JSON object.
            var customer = {};
            customer.Id = row.cells[0].innerHTML;
            customer.Name = row.cells[1].innerHTML;
            customer.Country = row.cells[2].innerHTML;
            customers.push(customer);
        }
 
        //Convert the JSON object to string and assign to Hidden Field.
        document.getElementsByName("CustomerJSON")[0].value = JSON.stringify(customers);
    }
</script>
 
 
Namespaces
You will need to import the following namespaces.
C#
using System.Data;
using Newtonsoft.Json;
 
VB.Net
Imports System.Data
Imports Newtonsoft.Json
 
 
Convert HTML Table to DataTable in ASP.Net
Inside the Submit Button click event, first the JSON string is fetched from the Request.Form collection using the Name of the Hidden Field and then it is converted to DataTable using JSON.Net library.
C#
protected void Submit(object sender, EventArgs e)
{
    string customerJSON = Request.Form["CustomerJSON"];
    DataTable dt = JsonConvert.DeserializeObject<DataTable>(customerJSON);
}
 
VB.Net
Protected Sub Submit(ByVal sender As Object, ByVal e As EventArgs)
    Dim customerJSON As String = Request.Form("CustomerJSON")
    Dim dt As DataTable = JsonConvert.DeserializeObject(Of DataTable)(customerJSON)
End Sub
 
 
Screenshots
The HTML Table
Convert HTML Table to DataTable in ASP.Net using C# and VB.Net
 
HTML Table values in DataTable
Convert HTML Table to DataTable in ASP.Net using C# and VB.Net
 
 
Downloads
Download Code