santosh-asp tutorial

ASP.NET Simple GridView

The GridView control provides many built-in capabilities that allow the user to sort, update, delete, select, and page through items in the control. The GridView control can be bound to a data source control, in order to bind a data source control, set the DataSourceID property of the GridView control to the ID value of the data source control.

In this article I have used SQL SERVER database for sample data.

  

    Create table  tblRecord
    (
      Id int primary key, Name varchar(200),Branch varchar(50)
     )
--Insert some record

Before you start to generate GridView in your asp file, you should create a ConnectionString in your web.Config File. Double click the web.config file on the right hand side of the Visual Studio and add the following connectionstring code in that file.

Web.Config File

  

<?xml version="1.0"?>
<configuration>
  <connectionStrings>
	 <add name="dbSantoshTestConnectionString" 
         connectionString="Data Source=PS-PC\SANTOSH;Initial Catalog=dbSantoshTest;Integrated Security=True"
      providerName="System.Data.SqlClient" />
  </connectionStrings>
</configuration>

The following is the full asp source code for selecting Id,Name,Branch from the authors table in the Pubs database.
Asp.net gridview example
Default.aspx <

  

    <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="gvDetail" runat="server" AutoGenerateColumns="False" BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" CellPadding="3" CellSpacing="2" DataKeyNames="Id" DataSourceID="sqldatasource1">
        <Columns>
            <asp:BoundField DataField="Id" HeaderText="Id" ReadOnly="True" SortExpression="Id" />
            <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
            <asp:BoundField DataField="Branch" HeaderText="Branch" SortExpression="Branch" />
        </Columns>
        <FooterStyle BackColor="#F7DFB5" ForeColor="#8C4510" />
        <HeaderStyle BackColor="#A55129" Font-Bold="True" ForeColor="White" />
        <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" />
        <RowStyle BackColor="#FFF7E7" ForeColor="#8C4510" />
        <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="White" />
        <SortedAscendingCellStyle BackColor="#FFF1D4" />
        <SortedAscendingHeaderStyle BackColor="#B95C30" />
        <SortedDescendingCellStyle BackColor="#F1E5CE" />
        <SortedDescendingHeaderStyle BackColor="#93451F" />

    </asp:GridView>

        <asp:SqlDataSource ID="sqldatasource1" runat="server" ConnectionString="<%$ ConnectionStrings:dbSantoshTestConnectionString %>" SelectCommand="SELECT * FROM [tblRecord]"></asp:SqlDataSource>

    </div>
    </form>
</body>
</html>

When you run this asp.net application , your output look likes the following image:-