ASP。 Net (C#) GridView 按钮控制内部触发 Gridview

Question

I have managed to add buttons in all my rows of gridview. But I am having problem with triggering controls while clicking on each button. What I want to do is, I want to display some contents of the row of which the button is clicked in the gridview. Below is my.aspx code. Please tell me how to write CS to perform this particular function.

<asp:GridView ID ="GridView1" class="table table-bordered table-condensed table-responsive table-hover" CellPadding="3" BorderWidth="7px" AllowPaging="True"  PagerStyle-HorizontalAlign="Left" PageSize="5" HeaderStyle-Font-Bold="True" PagerStyle-CssClass="GridPager" HeaderStyle-ForeColor="WhiteSmoke" HeaderStyle-BackColor="#0099cc" AllowSorting="True" AutoGenerateColumns="true" runat="server" OnPageIndexChanging="GridView1_PageIndexChanging" OnRowCommand="GridView_RowCommand">
                      <Columns>
                <asp:TemplateField>
                    <ItemTemplate>
               <asp:Button ID="btnGenNew" runat="server" CommandName="GJobID" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" Text="View" CssClass="btn btn-info" Enabled="true" /> 
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
                </asp:GridView>

Answer 1

You really don't need to use command arugment, or in fact bother using the GV events.

Just drop in the button as you have. And NOTE VERY careful, do use the datakeys feature. This allows you to get the database PK row id, but NOT have to put that value in the markup, or display it, or even hide it.

So, lets do a simple GV, and use the above knowledge.

Now, I going to include some "cells" or databound columns, and then some template columns.

And we will drop in two PLANE JANE buttons - and we will use PLANE jane good old standard server click events. No messing with command name or some such.

Ok, so here is our markup:

        <asp:GridView ID="GHotels" runat="server" CssClass="table"
             AutoGenerateColumns="False" DataKeyNames="ID" >
            <Columns>
                <asp:BoundField DataField="FirstName" HeaderText="FirstName"     />
                <asp:BoundField DataField="LastName" HeaderText="LastName"       />
                <asp:BoundField DataField="HotelName" HeaderText="HotelName"     />
                <asp:BoundField DataField="City" HeaderText="City"               />
                <asp:TemplateField HeaderText="Description">
                    <ItemTemplate>
                        <asp:TextBox ID="txtDescription" runat="server"
                            TextMode="MultiLine" Rows="4" Columns="40"
                            Text='<%# Eval("Description") %>'  >
                        </asp:TextBox>
                    </ItemTemplate>
                </asp:TemplateField>

                <asp:TemplateField HeaderText="Tog City">
                    <ItemTemplate>
                        <asp:Button ID="btnToggleCity" runat="server" Text="Tog City" 
                            CssClass="btn"/>
                    </ItemTemplate>
                </asp:TemplateField>

                <asp:TemplateField HeaderText="Tog Hotel">
                    <ItemTemplate>
                        <asp:Button ID="btnTogHotel" runat="server" Text="Tog Hotel" 
                            CssClass="btn"/>
                    </ItemTemplate>
                </asp:TemplateField>

            </Columns>
        </asp:GridView>

And our code to load:

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            LoadGrid();
    }

    void LoadGrid()
    {
        using (SqlConnection conn = new SqlConnection(Properties.Settings.Default.TEST4))
        {
            string strSQL = "SELECT * FROM tblHotelsA ORDER BY HotelName";

            using (SqlCommand cmdSQL = new SqlCommand(strSQL, conn))
            {
                conn.Open();
                DataTable rstData = new DataTable();
                rstData.Load(cmdSQL.ExecuteReader());
                GHotels.DataSource = rstData;
                GHotels.DataBind();
            }
        }
    }

And we now have this:

So, lets wire up the first button (toggle the City column).

So, lets add a plane jane click event. You can't double click on a button (like normal since it inside of the grid), so use markup, and go like this:

So, for the button, type in OnClick=, and NOTE HOW intel-sense pops up and gives you the option to create a click event.

The markup will become this:

<asp:TemplateField HeaderText="Tog City">
  <ItemTemplate>
    <asp:Button ID="btnToggleCity" runat="server" Text="Tog City" 
       CssClass="btn" OnClick="btnToggleCity_Click"  />
  </ItemTemplate>

</asp:TemplateField>

So, now flip to code behind, and we can do this:

    protected void btnToggleCity_Click(object sender, EventArgs e)
    {
        Button btn = sender as Button;
        GridViewRow gRow = btn.NamingContainer as GridViewRow;

        // get row index
        Debug.Print("Row index clicked on = " + gRow.RowIndex);

        // get data base PK id (data keys setting)

        int? PKID = GHotels.DataKeys[gRow.RowIndex]["ID"] as int?;
        Debug.Print("data PK id = " + PKID);

        // Now show hide say the City column.
        // this is a NON template, so we use cells collection.

        if (gRow.Cells[3].BackColor == System.Drawing.Color.FromName("skyblue"))
            gRow.Cells[3].BackColor = System.Drawing.Color.FromName("white");
        else
            gRow.Cells[3].BackColor = System.Drawing.Color.FromName("skyblue");


    }

So, the above operates on the current row.

We can "toggle" the color of the city cell. You get this:

And even wtih post-backs, the color does persist (so each row, we can toggle blue on and then off).

Ok, for the next button, we do the same, but this time, we going to use a template field.

So, rule is:

 databound column - use cells() - and by index - not name

 template columns - use find control,

So, for the 2nd button, we add the OnClick (let intel-sense offer to create event).

And then in our code behind, we get this:

    protected void btnTogHotel_Click(object sender, EventArgs e)
    {
        Button btn = sender as Button;
        GridViewRow gRow = btn.NamingContainer as GridViewRow;

        // get row index
        Debug.Print("Row index clicked on = " + gRow.RowIndex);

        // get data base PK id (data keys setting)

        int? PKID = GHotels.DataKeys[gRow.RowIndex]["ID"] as int?;
        Debug.Print("data PK id = " + PKID);

        // Now toggle color for description

        TextBox txtD = gRow.FindControl("txtDescription") as TextBox;

        txtD.Visible = !txtD.Visible;
    }

So say I click on the last 3 buttons (tog hotel - I meant to type "description")

So, we now see this:

So, even with a plane jane button click:

We can get the row index

We can get the database PK id (and note how not displayed in markup)

We can get a cell, or a templated control - do whatever we want then.