ASP.Net: Show data in run time table row generate using Table control, with bootstrap css.

1. Database

asp_db

2. Web config

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <connectionStrings>
    
   <add name="DatabaseEntities" connectionString="metadata=res://*/App_Code.Model.csdl|res://*/App_Code.Model.ssdl|res://*/App_Code.Model.msl;provider=System.Data.SqlClient;provider connection string=&quot;Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True;MultipleActiveResultSets=True&quot;" providerName="System.Data.EntityClient" />
 
  </connectionStrings>
    <system.web>
   
    <compilation debug="true" targetFramework="4.0">
        </compilation>
      </system.web>

</configuration>


3. Web form design

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="NehaProblems.aspx.cs" Inherits="NehaProblems" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div  style=" width:400px; margin: auto">
        <asp:Table ID="Table1" runat="server" CssClass="table table-hover" >
         </asp:Table>            
         </div>
         <center>
         <asp:Button ID="Button1" runat="server" Text="Bordered"  CssClass="btn btn-warning" OnClick="Button1_Click" />
         <asp:Button ID="Button2" runat="server" Text="Striped"  CssClass="btn btn-success" OnClick="Button2_Click" />
         <asp:Button ID="Button3" runat="server" Text="Condensed"  CssClass="btn btn-danger" OnClick="Button3_Click" />
         </center>
    </div>
    </form>
</body>
</html>


4. Code behind

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.OleDb;
using System.Data.SqlClient ;
using System.Configuration;


public partial class NehaProblems : System.Web.UI.Page
{
    SqlConnection cnn;

    SqlCommand cmd;
    protected void Page_Load(object sender, EventArgs e)
    {
        cnn = new SqlConnection();
        cnn.ConnectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
                
        cmd = new SqlCommand();
        cmd.CommandText = "select * from customer";
        cmd.Connection = cnn;

        //connected 

        cnn.Open();
        SqlDataReader  r=  cmd.ExecuteReader();        
        TableHeaderRow hr = new TableHeaderRow();
        TableCell hrc1 = new TableCell();
        TableCell hrc2 = new TableCell();
        TableCell hrc3 = new TableCell();
        TableCell hrc4 = new TableCell();

        hrc1.Text = "ID";
        hrc2.Text = "Name";
        hrc3.Text = "City";
        hrc4.Text = "Salary";

        hr.Cells.Add(hrc1);
        hr.Cells.Add(hrc2);
        hr.Cells.Add(hrc3);
        hr.Cells.Add(hrc4);

        Table1.Rows.Add(hr);

        while (r.Read())
        {
            TableRow tr = new TableRow();
            TableCell c1 = new TableCell();
            TableCell c2 = new TableCell();
            TableCell c3 = new TableCell();
            TableCell c4 = new TableCell();

            Decimal cid = r.GetDecimal(0);
            String n = r.GetString(1);
            String c = r.GetString(2);
            Decimal sal = r.GetDecimal(3);          

            c1.Text = cid.ToString(); ;
            c2.Text = n;
            c3.Text = c;
            c4.Text = sal.ToString();


            tr.Cells.Add(c1);
            tr.Cells.Add(c2);
            tr.Cells.Add(c3);
            tr.Cells.Add(c4);
            Table1.Rows.Add(tr);
        }
        cnn.Close();
        //connected 
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        Table1.CssClass = "table table-bordered";
    }
    protected void Button2_Click(object sender, EventArgs e)
    {
        Table1.CssClass = "table table-striped";
    }
    protected void Button3_Click(object sender, EventArgs e)
    {
        Table1.CssClass = "table table-condensed";
    }
}


5. Output

table_control