How to create Serial No. Column in DataGridView using ASP.Net

 

Introduction

In this article i will describe how to generate Serial No. Column in DataGridView using ASP.Net.

History

In the Previous articles i explained how to create setup of visual studio windows application with databasehow to add paging in gridview of asp.nethow to retrieve value from query string using C# and ASP.Netwhat is namespace for arraylistGet Selected RadioButton Value of RadioButtonList using C# and ASP.Net and many more about ASP.Net.

Step 1.

Create Table "Products" in Your Database which contains following columns :

1. ID

2. Category

3. Product_Name

4. Price

Step 2.

Copy and Paste Below Code in your .aspx page.

<asp:GridView ID="gvdetails" runat="server" 
                        AutoGenerateColumns="False" CellPadding="4" Font-Bold="False" 
                        ForeColor="#333333" Width="600px">
                        <Columns>
                            <asp:TemplateField HeaderText="S No." ItemStyle-Width="40px">
                                <ItemTemplate>
                    <%#Container.DataItemIndex+1 %>
                                </ItemTemplate>
                                <ItemStyle Width="40px" />
                            </asp:TemplateField>
                          
                            <asp:BoundField DataField="ID" HeaderText="ID" ItemStyle-Width="40">
                                <ItemStyle Width="40px" />
                            </asp:BoundField>
                            <asp:BoundField DataField="category" HeaderText="Category" />
                            <asp:BoundField DataField="product_name" HeaderText="Product Name" />
                            <asp:BoundField DataField="price" HeaderText="Price" ItemStyle-Width="40">
                                <ItemStyle Width="40px" />
                            </asp:BoundField>
                            
                           
                        </Columns>
                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                        <HeaderStyle BackColor="#CCCCCC" Font-Bold="True" ForeColor="Gray" />
                        <EditRowStyle BackColor="#999999" />
                        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                    </asp:GridView>

Step 3.

Add Below Code on Load Event of your page :

  string dbstring = ConfigurationManager.ConnectionStrings["database_con"].ConnectionString;
        SqlConnection connection = new SqlConnection(dbstring);
        SqlDataAdapter ad = new SqlDataAdapter("SELECT * FROM Products", connection);
        DataSet ds = new DataSet();
        ad.Fill(ds);
        gvdetails.DataSource = ds;
        gvdetails.DataBind();

Step 4.

Now Run Your Application. And you can see Serial No. In your DataGridView.

Screenshot.

I have added Below code in DataGridView For generating Serial No. Column.

<asp:TemplateField HeaderText="S No.">
      <ItemTemplate>
          <%#Container.DataItemIndex+1 %>
      </ItemTemplate>
</asp:TemplateField>
Give your Valuable Comments.
comments powered by Disqus
 
Follow me on twitter
About Me
Harpreet Singh
I began programming with C++ when i was 17. Then at the middle of my study .NET came. Then I began to read C# and VB.NET. By the time i learnt SQL and ASP.NET, and developed some websites such as news portals that are active now. Currently i am running my own Software company.
More Articles