Tuesday, April 12, 2016

Add row in asp.net Gridview on button click using C# and vb.net

In this article I am going to explain how to add a row in gridview to insert the record into database on add new button click in asp.net.
Add row in asp.net Gridview on button click using C# and vb.net
Add row in asp.net Gridview on button click using C# and vb.net


Description:
We have 2 ways to implement this functionality. 1st one to add new row to Gridview dynamically (code behind). To implement this refer to this link how to add multiple rows to Gridview control dynamically in asp.net. 2nd is use the Gridview FooterTemplate. Put all the required control in footer template and enable the footer template on button click.

Implementation:
HTML Markup:
   <asp:Button ID="btnaddrow" runat="server" Text="Add New Record" />
  
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" AllowPaging="True" DataKeyNames="Id"
     CellPadding="4" ForeColor="#333333" GridLines="None">
  <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    <Columns>
        <asp:TemplateField HeaderText="Movie Name">
            <ItemTemplate>
               <%# Eval("Name") %>
            </ItemTemplate>
            <EditItemTemplate>
                <asp:TextBox ID="txtname" runat="server" Text='<%# Eval("Name") %>'></asp:TextBox>
            </EditItemTemplate>
            <FooterTemplate>
                <asp:TextBox ID="txtname" runat="server" />
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Enter Movie Name" ControlToValidate="txtname"></asp:RequiredFieldValidator>
            </FooterTemplate>
            <ItemStyle HorizontalAlign="Center" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Genre">
            <ItemTemplate>
              <%# Eval("Genre") %>
            </ItemTemplate>
             <EditItemTemplate>
                <asp:TextBox ID="txtgenre" runat="server" Text='<%# Eval("Genre") %>'></asp:TextBox>
            </EditItemTemplate>
            <FooterTemplate>
                <asp:TextBox ID="txtgenre" runat="server" />
                 <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Enter Genre" ControlToValidate="txtgenre"></asp:RequiredFieldValidator>
            </FooterTemplate>
             <ItemStyle HorizontalAlign="Center" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Budget">
            <ItemTemplate>
               <%# Eval("Budget") %>
            </ItemTemplate>
             <EditItemTemplate>
                <asp:TextBox ID="txtbudget" runat="server" Text='<%# Eval("Budget") %>'></asp:TextBox>
            </EditItemTemplate>
            <FooterTemplate>
                <asp:TextBox ID="txtbudget" runat="server"></asp:TextBox>
                 <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Enter Budget" ControlToValidate="txtbudget"></asp:RequiredFieldValidator>
            </FooterTemplate>
             <ItemStyle HorizontalAlign="Center" />

        </asp:TemplateField>
        <asp:TemplateField>
            <ItemTemplate>
             <asp:Button ID="btnedit" runat="server" Text="Edit" CommandName="Edit" CausesValidation="false"/><asp:Button ID="btndelete" runat="server" Text="Delete"  CommandName="Delete" CausesValidation="false" CssClass="btn"/>
            </ItemTemplate>
                <EditItemTemplate>
                    <asp:Button ID="btnupdate" runat="server" Text="Update"  CommandName="Update" CausesValidation="false"/><asp:Button ID="btncancel" runat="server" Text="Cancel"  CommandName="Cancel" CausesValidation="false" CssClass="btn" />
                </EditItemTemplate>
            <FooterTemplate>
                <asp:Button ID="btninsert" runat="server" Text="Insert Record" CommandName="Insert" />
            </FooterTemplate>
                <ItemStyle VerticalAlign="Top" />
        </asp:TemplateField>
    </Columns>
                       <EditRowStyle BackColor="#999999" />
                       <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                       <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                       <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                       <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                       <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                       <SortedAscendingCellStyle BackColor="#E9E7E2" />
                       <SortedAscendingHeaderStyle BackColor="#506C8C" />
                       <SortedDescendingCellStyle BackColor="#FFFDF8" />
                       <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
</asp:GridView>

Add the namespace
C# code:
using System.Data;
using System.Data.SqlClient;
using System.Configuration;

VB.net code:
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration

Bind data to Gridview
Create a function to fetch the record from database and bind to Gridview and call the function on page laod.

C# code:
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            BindGridview();
        }
    }
    public void BindGridview()
    {
        try
        {
            SqlDataAdapter adp = new SqlDataAdapter("Select * from Tb_Movie", con);
            DataTable dt = new DataTable();
            adp.Fill(dt);
            GridView1.DataSource = dt;
            GridView1.DataBind();
        }
        catch (Exception ex)
        {

        }
    }

VB.net code:
Dim con As New SqlConnection(ConfigurationManager.ConnectionStrings("connection").ToString())
    Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            BindGridview()
        End If
    End Sub
    Public Sub BindGridview()
        Try
            Dim adp As New SqlDataAdapter("Select * from Tb_Movie", con)
            Dim dt As New DataTable()
            adp.Fill(dt)
            GridView1.DataSource = dt
            GridView1.DataBind()
        Catch ex As Exception
        End Try
    End Sub

Enable the Gridview Footer
On add new record button click write the below given to show the FooterTemplate of gridview.

C# code:
protected void btnaddrow_Click(object sender, EventArgs e)
    {
        GridView1.ShowFooter = true;
        BindGridview();
    }

VB.net code:
   Protected Sub btnaddrow_Click(sender As Object, e As System.EventArgs) Handles btnaddrow.Click
        GridView1.ShowFooter = True
        BindGridview()
    End Sub


No comments:

Post a Comment