Dynamically hide HTML Table Columns using C# and VB.Net in ASP.Net

Hi ramco1917,

Please refer below sample.

HTML

<asp:Label ID="lblHtml" runat="Server"></asp:Label>
<div class="modal" tabindex="-1" role="dialog" id="modal_form_horizontal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title">Details</h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <table class="table">
                    <tr>
                        <td>Id</td>
                        <td><asp:Label ID="lblId" runat="server" Font-Bold="true" ForeColor="Red" /></td>
                    </tr>
                    <tr>
                        <td>Name</td>
                        <td><asp:Label ID="lblName" runat="server" /></td>
                    </tr>
                    <tr>
                        <td>Country</td>
                        <td><asp:Label ID="lblCountry" runat="server" /></td>
                    </tr>
                    <tr>
                        <td>City</td>
                        <td><asp:Label ID="lblCity" runat="server" /></td>
                    </tr>
                </table>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
            </div>
        </div>
    </div>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script type="text/javascript">
    function BindData(ele) {
        $('[id*=lblId]').html($(ele).closest('tr').find('td').eq(0).html());
        $('[id*=lblName]').html($(ele).closest('tr').find('td').eq(1).html());
        $('[id*=lblCountry]').html($(ele).closest('tr').find('td').eq(2).html());
        $('[id*=lblCity]').html($(ele).closest('tr').find('td').eq(3).html());
    }
</script>

Namespaces

C#

using System.Text;
using System.Reflection;

VB.Net

Imports System.Text
Imports System.Reflection

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        List<Customer> customers = new List<Customer>();
        customers.Add(new Customer { CustomerId = "ALFKI", ContactName = "Alfreds Futterkiste", Country = "UK", City = "London" });
        customers.Add(new Customer { CustomerId = "ANATR", ContactName = "Around the Horn", Country = "Germany", City = "Berlin" });
        customers.Add(new Customer { CustomerId = "ANTON", ContactName = "Island Trading", Country = "Mexico", City = "México D.F." });

        List<string> fields = new List<string>();
        fields.Add("CustomerId");
        fields.Add("City");

        StringBuilder htmlTable = new StringBuilder();
        htmlTable.Append("<table class='table table-responsive'><thead><tr>");
        foreach (PropertyInfo _property in typeof(Customer).GetProperties())
        {
            if (fields.Contains(_property.Name))
            {
                htmlTable.Append("<th style='display:none'>" + _property.Name + "</th>");
            }
            else
            {
                htmlTable.Append("<th>" + _property.Name + "</th>");
            }
        }

        htmlTable.Append("<th>Action</th></tr></thead>");
        htmlTable.Append("<tbody>");
        foreach (Customer customer in customers)
        {
            htmlTable.Append("<tr>");
            foreach (PropertyInfo _property in customer.GetType().GetProperties())
            {
                if (fields.Contains(_property.Name))
                {
                    htmlTable.Append("<td style='display:none'>" + _property.GetValue(customer, null) + "</td>");
                }
                else
                {
                    htmlTable.Append("<td>" + _property.GetValue(customer, null) + "</td>");
                }
            }
            htmlTable.Append("<td><a id='btnEdit' style='cursor:pointer;' class='list-icons-item text-primary-600' data-toggle='modal' data-backdrop='static' data-keyboard='false' data-target='#modal_form_horizontal' onclick='BindData(this);'><i class='icon-pencil7 mr-1'></i>Edit</a></td>");
            htmlTable.Append("</tr>");
        }
        htmlTable.Append("</tbody>");
        htmlTable.Append("</table>");
        lblHtml.Text = htmlTable.ToString();
    }
}

public class Customer
{
    public string CustomerId { get; set; }
    public string ContactName { get; set; }
    public string City { get; set; }
    public string Country { get; set; }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim customers As List(Of Customer) = New List(Of Customer)()
        customers.Add(New Customer With {
            .CustomerId = "ALFKI",
            .ContactName = "Alfreds Futterkiste",
            .Country = "UK",
            .City = "London"
        })
        customers.Add(New Customer With {
            .CustomerId = "ANATR",
            .ContactName = "Around the Horn",
            .Country = "Germany",
            .City = "Berlin"
        })
        customers.Add(New Customer With {
            .CustomerId = "ANTON",
            .ContactName = "Island Trading",
            .Country = "Mexico",
            .City = "México D.F."
        })
        Dim fields As List(Of String) = New List(Of String)()
        fields.Add("CustomerId")
        fields.Add("City")
        Dim htmlTable As StringBuilder = New StringBuilder()
        htmlTable.Append("<table class='table table-responsive'><thead><tr>")

        For Each _property As PropertyInfo In GetType(Customer).GetProperties()
            If fields.Contains(_property.Name) Then
                htmlTable.Append("<th style='display:none'>" & _property.Name & "</th>")
            Else
                htmlTable.Append("<th>" & _property.Name & "</th>")
            End If
        Next

        htmlTable.Append("<th>Action</th></tr></thead>")
        htmlTable.Append("<tbody>")

        For Each customer As Customer In customers
            htmlTable.Append("<tr>")
            For Each _property As PropertyInfo In customer.GetType().GetProperties()
                If fields.Contains(_property.Name) Then
                    htmlTable.Append("<td style='display:none'>" & _property.GetValue(customer, Nothing) & "</td>")
                Else
                    htmlTable.Append("<td>" & _property.GetValue(customer, Nothing) & "</td>")
                End If
            Next

            htmlTable.Append("<td class='text-center'><a id='btnEdit' style='cursor:pointer;' class='list-icons-item text-primary-600' data-toggle='modal' data-backdrop='static' data-keyboard='false' data-target='#modal_form_horizontal' onclick='BindData(this);'><i class='icon-pencil7 mr-1'></i>Edit</a></td>")
            htmlTable.Append("</tr>")
        Next

        htmlTable.Append("</tbody>")
        htmlTable.Append("</table>")
        lblHtml.Text = htmlTable.ToString()
    End If
End Sub

Public Class Customer
    Public Property CustomerId As String
    Public Property ContactName As String
    Public Property City As String
    Public Property Country As String
End Class

Screenshot