How to add Dynamically blank row in Gridview in Asp.net

Description:- 

Insert blank row in GridView it is possible to check while taking data from SQL server. Like if I got one row from table and got row id then I will check if Id is more than some value then insert new row in GridView so by this we will achieve this functionality in GridView to add new row. So in Grid view we will bind column from SQL server Bind Field is user for binding the field value in Grid view from SQL server.

Now let’s create Webpage and Bind SQL table data in Grid view and blank row add in each row after in Grid view.

<div>
   <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" Width="400px"
      OnRowDataBound="GridView1_RowDataBound" OnRowCreated="GridView1_RowCreated" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="4" ForeColor="Black" GridLines="Horizontal">
      <Columns>
         <asp:BoundField DataField="stor_id" HeaderText="Store ID" ItemStyle-HorizontalAlign="Center">
            <ItemStyle HorizontalAlign="Center"></ItemStyle>
         </asp:BoundField>
         <asp:BoundField DataField="ord_num" HeaderText="Order No." ItemStyle-HorizontalAlign="Center">
            <ItemStyle HorizontalAlign="Center"></ItemStyle>
         </asp:BoundField>
         <asp:BoundField DataField="title_id" HeaderText="Title ID" ItemStyle-HorizontalAlign="Center">
            <ItemStyle HorizontalAlign="Center"></ItemStyle>
         </asp:BoundField>
         <asp:BoundField DataField="qty" HeaderText="Quantity" ItemStyle-HorizontalAlign="Center">
            <ItemStyle HorizontalAlign="Center"></ItemStyle>
         </asp:BoundField>
      </Columns>
      <FooterStyle BackColor="#CCCC99" ForeColor="Black" />
      <HeaderStyle BackColor="#333333" Font-Bold="True" ForeColor="White" />
      <PagerStyle BackColor="White" ForeColor="Black" HorizontalAlign="Right" />
      <SelectedRowStyle BackColor="#CC3333" Font-Bold="True" ForeColor="White" />
      <SortedAscendingCellStyle BackColor="#F7F7F7" />
      <SortedAscendingHeaderStyle BackColor="#4B4B4B" />
      <SortedDescendingCellStyle BackColor="#E5E5E5" />
      <SortedDescendingHeaderStyle BackColor="#242121" />
   </asp:GridView>
</div>

Now create table in your Sql server so we will take data from that table and bind in GridView and add some values in table.

CREATE TABLE [dbo].[saless](
      [ord_num] [varchar](10) NOT NULL,
      [stor_id] [int] NOT NULL,
      [title_id] [varchar](50) NOT NULL,
      [payterms] [varchar](10) NOT NULL,
      [qty] [bigint] NOT NULL
) ON [PRIMARY]

GO

Now let’s create method for taking data from Sql Server.

Protected void Page_Load(object sender, EventArgs e)
{
    SqlDataAdapter adapter = new SqlDataAdapter();
    DataSet ds = new DataSet();
    int i = 0;
    string sql = null;
    string connetionString = "Data Source=’ServerName’;Initial Catalog=’DatabaseName’;Persist Security Info=True;User ID=’UserName’;Password=’Password’";
    sql = "select  distinct top 14 stor_id,ord_num,title_id,qty from saless group by stor_id,ord_num,title_id,qty";
    SqlConnection connection = new SqlConnection(connetionString);
    connection.Open();
    SqlCommand command = new SqlCommand(sql, connection);
    adapter.SelectCommand = command;
    adapter.Fill(ds);
    adapter.Dispose();
    command.Dispose();
    connection.Close();
    GridView1.DataSource = ds.Tables[0];
    GridView1.DataBind();
}

Now let’s check each row id in gridrow bound event so we will get Id of that column when row taken from Sql server.

Protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
  if (e.Row.RowType == DataControlRowType.DataRow)
  {
    storid = Convert.ToInt32(DataBinder.Eval(e.Row.DataItem, "stor_id").ToString());
  }
}

Now let’s Check When Grid row Created then We will add blank row in Grid view.

Protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
{
    bool newRow = false;
    if ((storid > 0) && (DataBinder.Eval(e.Row.DataItem, "stor_id") != null))
    {
        if (storid != Convert.ToInt32(DataBinder.Eval(e.Row.DataItem, "stor_id").ToString()))
        newRow = true;
    }
    if ((storid > 0) && (DataBinder.Eval(e.Row.DataItem, "stor_id") == null))
    {
        newRow = true;
        rowIndex = 0;
    }
    if (newRow)
    {
        AddNewRow(sender, e);
    }
}

Now add Code for blank row inserting in GridView.

Public void AddNewRow(object sender, GridViewRowEventArgs e)
{
    GridView GridView1 = (GridView)sender;
    GridViewRow NewTotalRow = new GridViewRow(0, 0, DataControlRowType.DataRow, DataControlRowState.Insert);
    NewTotalRow.Font.Bold = true;
    NewTotalRow.BackColor = System.Drawing.Color.Black;
    TableCell HeaderCell = new TableCell();
    HeaderCell.Height = 1;
    HeaderCell.HorizontalAlign = HorizontalAlign.Center;
    HeaderCell.ColumnSpan = 4;
    NewTotalRow.Cells.Add(HeaderCell);
    GridView1.Controls[0].Controls.AddAt(e.Row.RowIndex + rowIndex, NewTotalRow);
    rowIndex++;
}

Now let’s check Webpage in browser blank row is inserted in each row after or what.

Author : Umesh Patel

Related Posts