Introduction:
Here I will explain how to show or display data from datatable in html table in asp.net from database in c#, vb.net or display data from database in html table in asp.net using c#, vb.net with example or get data from datatable and show it in html table in asp.net using c#, vb.net.
Description:
In previous articles I explained scrollable table with fixed header using css, jQuery play youtube videos in asp.net, edit gridview row details with ajax modalpopupextender in asp.net, import data from excel to database in asp.net, read xml file and bind data to gridview in asp.net, insert selected gridview rows in database in asp.net and many articles relating to gridview, asp.net, c#,vb.net and jQuery. Now I will explain how insert display datatable data html table in asp.net from database in c#, vb.net.
In previous articles I explained scrollable table with fixed header using css, jQuery play youtube videos in asp.net, edit gridview row details with ajax modalpopupextender in asp.net, import data from excel to database in asp.net, read xml file and bind data to gridview in asp.net, insert selected gridview rows in database in asp.net and many articles relating to gridview, asp.net, c#,vb.net and jQuery. Now I will explain how insert display datatable data html table in asp.net from database in c#, vb.net.
Before
we implement this example first design one table EmployeeInfo in your database as
shown below
 |
Now
create one new web application and open your aspx page and write the code like
as shown below
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"
runat="server">
<title>Display Datatable in
HTML Table in asp.net from database using c#, vb.net</title>
</head>
<body>
<form id="form1"
runat="server">
<div>
<asp:Label ID="lblResult"
runat="server"/>
</div>
</form>
</body>
</html>
|
Now open aspx page codebehind behind file and add following
namespaces
C#
Code
using System;
using System.Data.SqlClient;
using System.Data;
using System.Text;
|
After completion of adding namespaces you need to write the
code like as shown below
protected void Page_Load(object
sender, EventArgs e)
{
if (!IsPostBack)
{
BindHtmlTable();
}
}
// Bind HTML Table Data
private void BindHtmlTable()
{
DataTable dt = new DataTable();
using (SqlConnection con = new
SqlConnection("Data
Source=Suresh;Integrated Security=true;Initial Catalog=MySampleDB"))
{
using (SqlCommand cmd = new
SqlCommand("select
* from Employee_Details", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
con.Close();
}
}
StringBuilder htmlTable
= new StringBuilder();
htmlTable.Append("<table
border='1' cellpadding=4 cellspacing=0>");
htmlTable.Append("<tr>");
for (int i = 0; i < dt.Columns.Count; i++)
{
htmlTable.Append("<th>"
+ dt.Columns[i].ColumnName + "</th>");
}
htmlTable.Append("</tr>");
for (int j = 0; j < dt.Rows.Count; j++)
{
htmlTable.Append("<tr>");
htmlTable.Append("<td>"
+ dt.Rows[j]["userid"] + "</td>");
htmlTable.Append("<td>"
+ dt.Rows[j]["username"] + "</td>");
htmlTable.Append("<td>"
+ dt.Rows[j]["firstname"] + "</td>");
htmlTable.Append("<td>"
+ dt.Rows[j]["lastname"] + "</td>");
htmlTable.Append("<td>"
+ dt.Rows[j]["city"] + "</td>");
htmlTable.Append("<td>"
+ dt.Rows[j]["designation"] + "</td>");
htmlTable.Append("</tr>");
}
htmlTable.Append("</table>");
lblResult.Text = htmlTable.ToString();
}
|
VB.NET
Code
Imports System.Data.SqlClient
Imports System.Data
Imports System.Text
Partial Class VBCode
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal
sender As Object,
ByVal e As EventArgs) Handles
Me.Load
If Not
IsPostBack Then
BindHtmlTable()
End If
End Sub
' Bind HTML Table Data
Private Sub BindHtmlTable()
Dim dt As New DataTable()
Using con As New SqlConnection("Data
Source=Suresh;Integrated Security=true;Initial Catalog=MySampleDB")
Using cmd As New SqlCommand("select
* from Employee_Details", con)
con.Open()
Dim da As New SqlDataAdapter(cmd)
da.Fill(dt)
con.Close()
End Using
End Using
Dim htmlTable As New StringBuilder()
htmlTable.Append("<table
border='1' cellpadding=4 cellspacing=0>")
htmlTable.Append("<tr>")
For i As Integer = 0 To dt.Columns.Count - 1
htmlTable.Append("<th>"
& dt.Columns(i).ColumnName & "</th>")
Next
htmlTable.Append("</tr>")
For j As Integer = 0 To dt.Rows.Count - 1
htmlTable.Append("<tr>")
htmlTable.Append("<td>"
& dt.Rows(j)("userid") &
"</td>")
htmlTable.Append("<td>"
& dt.Rows(j)("username")
& "</td>")
htmlTable.Append("<td>"
& dt.Rows(j)("firstname")
& "</td>")
htmlTable.Append("<td>"
& dt.Rows(j)("lastname")
& "</td>")
htmlTable.Append("<td>"
& dt.Rows(j)("city") & "</td>")
htmlTable.Append("<td>"
& dt.Rows(j)("designation")
& "</td>")
htmlTable.Append("</tr>")
Next
htmlTable.Append("</table>")
lblResult.Text = htmlTable.ToString()
End Sub
End Class
|
Demo
 |
Download
Sample Code Attached
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
2 comments :
Hi this is superb code....I want to perform update and delete operation in above methods. I only have a Placeholder on my aspx design page and remaining code is on aspx.cs. i am using bootstrap. table.Append(a class='btn btn-warning' href='EditTransportVehicle.aspx?ID=" + rdr[0] +
By clicking on first cell, How to display the record the in Pop Up, Please do reply
Note: Only a member of this blog may post a comment.