How to add button to GridView bound to Datatable ASP.Net

Question

I have a GridView in in my webform. I set the data source as a DataTable, and bind it. When I tried adding an edit button by selecting "Enable edit/update/delete", it wasn't showing up.

But, I managed to show the button manually. On button click, how do I get the first cell value of the row, of which the button is clicked ?

My GridView

<asp:GridView ID="SOGridView" runat="server" ShowHeader="False" 
            onrowdatabound="SOGridView_RowDataBound" onrowcommand="SOGridView_RowCommand">
        <Columns>
        <asp:TemplateField HeaderText="Actions">
                        <ItemTemplate>
                            <asp:Button ID="btnAddNewSO" runat="server"   CommandName="Select" height="40px" 
                                Text="Add" Width="75px" onclick="btnAddNewSO_Click" />
                        </ItemTemplate>
                    </asp:TemplateField></Columns>
        </asp:GridView>

On Button Click,

SOGridView.DataSource = dt;
SOGridView.DataBind();

MY DATA TABLE

    DataTable dt = new DataTable();
dt.Columns.Add(new DataColumn("Col1", typeof(string)));
dt.Columns.Add(new DataColumn("Col2", typeof(string)));
dt.Columns.Add(new DataColumn("Col3", typeof(string)));
dt.Columns.Add(new DataColumn("Col4", typeof(string)));
dt.Columns.Add(new DataColumn("Col5", typeof(string)));
dt.Columns.Add(new DataColumn("Col6", typeof(string)));
dt.Columns.Add(new DataColumn("Col7", typeof(string)));

On Button Click in the page,

    DataRow dr = dt.NewRow();
dr["Col1"] = ddlitemcategory.SelectedValue;
dr["Col2"] = ddlitems.SelectedValue;
dr["Col3"] = textQty.Text;
dr["Col4"] = textDisc.Text;
dr["Col5"] = textAmount.Text;
dr["Col6"] = textPDeliveryDate.Text;
dr["Col7"] = textPShipmentDate.Text;
dt.Rows.Add(dr);

SOGridView.DataSource = dt;
SOGridView.DataBind();

Are you using BoundColumn or <asp:TemplateField for your column definition? — Dennis R
– Dennis R, Commented Jul 22, 2014 at 4:21

Amit Kumar · Accepted Answer · 2014-07-22 05:33:53Z

1

you just need rewrite code for button as follow

<asp:Button ID="addbtn" runat="server"  Text="save" CommandName="SAVE" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>"/>

and add onrowcommand event to gridview and also add datakeyName attribute to gridview.

 <asp:GridView  ID="GridView1" runat="server" DataSourceID="SqlDataSource1" DataKeyNames="Id"
            AutoGenerateColumns="false" onrowcommand="GridView1_RowCommand">

then write code on rowcommand

  protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            if (e.CommandName == "SAVE")
            {
                int index = Convert.ToInt32(e.CommandArgument.ToString());
                int id=Convert.ToInt32(GridView1.DataKeys[index].Value.ToString());
                string deltequer="delete from yourtablename where id='"+id+"'";
            }
        }

edited Jul 22, 2014 at 5:33

answered Jul 22, 2014 at 4:40

Amit Kumar

5,96212 gold badges49 silver badges88 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Roshan Over a year ago

This worked well, and I got the GridView's Row index value. As I have mentioned, I am populating the gridview from a datatable. How do I know whether, the row to be edited is same as the row in the Data Table ?

Amit Kumar Over a year ago

i didn't get you . tell me what action you wan to perform on click event of button. do you want to update record in database ?

Roshan Over a year ago

Actually, I want to delete the record. My gridview is bound to a data table. The button btnAddNewSO, on clicking should delete the row in the GridView, as well as in the Data Table. Sorry for the naming convention. I should have to change it to "DeletSO".

Roshan Over a year ago

Is it possible to delet from the Data Table, and not using SQL ?

Amit Kumar Over a year ago

"not using sql". from where your data table is populated ? if you don't want to write sql query then then there are too many other things , like EF or ORM.

|

Dennis R · Accepted Answer · 2014-07-22 04:44:03Z

0

Use the CommandArgument to pass in any additional value (first databound field value) to the CommandName which you can manipulate in the code behind.

Change your TemplateField as below

<asp:TemplateField HeaderText="Actions">
       <ItemTemplate>
           <asp:Button ID="btnAddNewSO" runat="server"   CommandName="Select" height="40px" 
                            Text="Add" Width="75px"  CommandArgument='<%# Eval("ID") %>' />
       </ItemTemplate>
 </asp:TemplateField>

and then in your code behind.

protected void SOGridView_RowCommand(object sender, 
  GridViewCommandEventArgs e)
{
  if (e.CommandName == "Select")
  {
    // Retrieve the CommandArgument property
    int cellvalue = Convert.ToInt32(e.CommandArgument); // or convert to other datatype
  }
}

Or just pass in the RowIndex as the CommandArgument and then you can access any control of the respective row using FindControl. So now your button definition would become

<asp:Button ID="btnAddNewSO" runat="server"   CommandName="Select" height="40px" 
                            Text="Add" Width="75px"  CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" />

and your code behind

if (e.CommandName == "Select")
{
    int index = Convert.ToInt32(e.CommandArgument);

   // Retrieve the row that contains the button 
   // from the Rows collection.
   GridViewRow row = SOGridView.Rows[index];
   // use FindControl to find any control you want to access from the row collection
}

edited Jul 22, 2014 at 4:44

answered Jul 22, 2014 at 4:36

Dennis R

3,2471 gold badge21 silver badges24 bronze badges

4 Comments

Roshan Over a year ago

But, where from do we get the value of Eval("ID") ? Id it like the first cell header ?

Dennis R Over a year ago

No that's one of the field in the datasource.

Roshan Over a year ago

And how do I use this button to edit item from the data table ?

Dennis R Over a year ago

You'll have to remove the respective row (matching the key) from the data table and rebind the grid with the updated datasource like SOGridView.DataSource = dt; SOGridView.DataBind();

Collectives™ on Stack Overflow

How to add button to GridView bound to Datatable ASP.Net

2 Answers 2

7 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related