Scribd
Upload
109 views

How To Create Dynamic Gridview With Instant Row

This document describes how to create a dynamic gridview that binds data instantly using input controls in ASP.NET. It involves 3 steps: 1) Creating an ASPX page with labels, textboxes, and a gridview. 2) Populating a DataTable from the textbox values on button click and storing it in viewstate. 3) Binding the gridview to the DataTable to display the dynamic data. Code behind handles adding new rows to the DataTable on each button click and rebinding the gridview.

Uploaded by

Ram Kushwaha
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
109 views

How To Create Dynamic Gridview With Instant Row

This document describes how to create a dynamic gridview that binds data instantly using input controls in ASP.NET. It involves 3 steps: 1) Creating an ASPX page with labels, textboxes, and a gridview. 2) Populating a DataTable from the textbox values on button click and storing it in viewstate. 3) Binding the gridview to the DataTable to display the dynamic data. Code behind handles adding new rows to the DataTable on each button click and rebinding the gridview.

Uploaded by

Ram Kushwaha
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

How To create Dynamic Gridview with Instant Row

Here I am telling How can we bind Dynamic Grid Value by Instant Input control , Or we can say dynamically bind grid data.

Step 1(Default.aspx Page) 1- First of all create DynamicGrid.aspx page . Inside that create three label fields EmpId, EmpName , Salary and create three textboxes regarding fields 2- Add two button one for Add Employee and second for Clear. 3- Below buttons add a Gridview Control Below is the code Given for DynamicGrid.aspx

DynamicGrid.aspx Page
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DynamicGrid.aspx.cs" Inherits="DynamicGrid" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <table align="left" border="1px" width="40%"> <tr> <td valign="top" colspan="2" align="center" bgcolor="Aqua" > <b>Dynamic Grid Binding Example<br /> </b></td> </tr> <tr> <td valign="top" width="40%" align="center" bgcolor="Aqua" > Emp Id</td> <td width="60%">

<asp:TextBox ID="txtEmpid" runat="server"></asp:TextBox> </td> </tr> <tr> <td align="center" bgcolor="Aqua" > EmpName</td> <td> <asp:TextBox ID="txtEmpName" runat="server"></asp:TextBox> </td> </tr> <tr> <td align="center" bgcolor="Aqua" > Salary</td> <td> <asp:TextBox ID="txtSalary" runat="server"></asp:TextBox> </td> </tr> <tr> <td colspan="2" align ="center" bgcolor="Aqua"> <asp:Button ID="btnAdd" runat="server" Text="AddEmployee" onclick="btnAdd_Click" /> &nbsp; <asp:Button ID="btnClear" runat="server" Text="Clear" onclick="btnClear_Click" /> </td> </tr> <tr> <td colspan="2" align="center" bgcolor="Aqua"> <b>Dynamic Grid</b></td> </tr> <tr> <td colspan="2" align="center" bgcolor="Aqua"> <asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None" Width="67%" Style="textalign: left" BackColor="#99CCFF" > <SelectedRowStyle BackColor="#D1DDF1" FontBold="True" ForeColor="#333333" /> <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" /> <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> <AlternatingRowStyle BackColor="White" /> </asp:GridView> </td> </tr> </table>

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

Step 2
After page load we will get the output as below.

Step3Now we implement logic in code behind page means (DynamicGrid.aspx.cs) 1-First of all we add System.Data namespace. 2- on click of Add Employee button we create DataTable and save values to tables columns. 3-Save DataTable state in Viewstate 4-Bind GridView by this Dynamic DataTable. So on Every AddEmployee button click we check ViewState[tb] is null or not . If it is null means no data available in DataTable. Below is the DynamicGrid.aspx.cs page .

CODE_BEHIND
using System; using System.Data; public partial class DynamicGrid : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void btnAdd_Click(object sender, EventArgs e) { DataTable dt = new DataTable("MyTable"); DataRow dr = null; if (ViewState["tbl"] == null) { dt.Columns.Add(new DataColumn("EmpID", typeof(string))); dt.Columns.Add(new DataColumn("EmpName", typeof(string))); dt.Columns.Add(new DataColumn("Salary", typeof(double))); dr = dt.NewRow(); dr["EmpId"] = txtEmpid.Text; dr["EmpName"] = txtEmpName.Text; dr["Salary"] = Convert.ToDouble(txtSalary.Text); dt.Rows.Add(dr); ViewState["tbl"] = dt; GridView1.DataSource = dt; GridView1.DataBind(); } else { dt = ViewState["tbl"] as DataTable; dr = dt.NewRow(); dr["EmpId"] = txtEmpid.Text; dr["EmpName"] = txtEmpName.Text; dr["Salary"] = Convert.ToDouble(txtSalary.Text); dt.Rows.Add(dr); ViewState["tbl"] = dt; GridView1.DataSource = dt; GridView1.DataBind(); }

} protected void btnClear_Click(object sender, EventArgs e) { txtEmpid.Text = string.Empty; txtEmpName.Text = string.Empty; txtSalary.Text = ""; } } Here is outPut.

You might also like