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
|
In
the previous article I have explained how to avoid (prevent) duplicate recordinsert on page refresh in asp.net , how to auto generate and display Serialnumber (row number) in asp.net gridview and how to check uncheck ORselect/deselect checkboxes in asp.net gridview control using Jquery.
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