In this Article, We are going to see a simple example of DataBinding in GridView. For Demonstration, I have created a database (named EmployeeDB) in which We have a table named Employee.
Final Preview:
Let's Begin:
1) Drop GridView Control from the toolbox and set AutoGenerateColumns to false
2) Add Columns Collection (tag) which manage the collection of Column fields.
3) Inside Columns tag, Add column field (BoundField) which displays the value of a field in a data source.
4) Set the DataField property to the name of column in table for binding to the BoundField object and Set HeaderText value for Displaying it on the GridView's Header.
5) We can also adjust the appearance of the Header and Row in a GridView using <HeaderStyle> element and <RowStyle> element.
Default.aspx Coding:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1"
runat="server" AutoGenerateColumns="false" CellPadding="6">
<Columns>
<asp:BoundField DataField="Id" HeaderText="Employee
ID" />
<asp:BoundField DataField="First Name"
HeaderText="First Name"
/>
<asp:BoundField DataField="Last Name"
HeaderText="Last Name"
/>
<asp:BoundField DataField="City" HeaderText="City" />
</Columns>
<HeaderStyle BackColor="#0066cc" Font-Bold="true" ForeColor="White" />
<RowStyle BackColor="#bfdfff" ForeColor="Black" />
</asp:GridView>
</div>
</form>
</body>
</html>
|
In this Example, I am using ADO.NET for Binding the data to GridView. For this We have to add System.Data and System.Data.SqlClient namespace in the namespace declaration.
Default.aspx.cs Code:
using System;
using System.Data;
using
System.Data.SqlClient;
using
System.Configuration;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
ShowData();
}
}
//getting Connection String from Web.config file
string cs = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString;
//Method for DataBinding
protected void ShowData()
{
DataTable dt = new DataTable();
SqlConnection con =
new SqlConnection(cs);
SqlDataAdapter adapt
= new SqlDataAdapter("select * from Employee",con);
con.Open();
adapt.Fill(dt);
con.Close();
if(dt.Rows.Count>0)
{
GridView1.DataSource = dt;
GridView1.DataBind();
}
}
}
|
Hope you like it. Thanks.
[Download Source Code from Google Drive]
I've tried your code, but in the if clause, if database is empty, the grid is empty too. removing the if clause, even if the database is empty, it will show columns headers, that's fine to me.
ReplyDeleteYes, you can remove if clause, if you want to show gridview's column header even if the database is empty
Delete