How do I create button control in GridView dynamically

Question

User-218090889 posted

Hello, I am a new person in this field, I need help.

I am working on a web application that has many pages including Master page. One of the pages I call UserBestPage.aspx (not real name) has GridView control that has a custom template, in the template I have a PlaceHolder control with ID= phRow where I will like to put Button control dynamically at run time. So in UserBestPage.aspx.cs I also have a Class I called CreateUserButton that will create three buttons that I will use in the same code-behind page by calling their method.

My question is, how do I code my CreateUserButton Class, and how to call the method to where I want it to be.

This is the code I tried, but it would not compile:

public class CreateUserButton
{
}
public void CreateUser1Button()
{
ContentPlaceHolder ContentPlaceHolder1 = Page.Master.FindControl("ContentPlaceHolder1") as ContentPlaceHolder;

PlaceHolder phRows = (PlaceHolder)ContentPlaceHolder1.FindControl("phRow");
Button b = new Button();
phRow.Controls.Add(b);
}

Answer 1

User-707554951 posted

Hi Enzyme,

My question is, how do I code my CreateUserButton Class, and how to call the method to where I want it to be.

From your question and code you provide for us, firstly, I suggest CreateUser1Button method should return a Button. Then you  could new an instance by using your CreateUserButton class in the RowDataBound event of gridview and call CreateUser1Button to create an button,

I make a simply sample, you could refer to it:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowDataBound="GridView1_RowDataBound">
            <Columns>
                <asp:BoundField DataField="id" HeaderText="ID"  />
                <asp:TemplateField HeaderText ="comment">
                    <ItemTemplate>
                        <asp:PlaceHolder ID="PlaceHolder1" runat="server">
                            <asp:Label ID="Label1" runat="server" Text='<%#Eval("Comment") %>'></asp:Label>
                        </asp:PlaceHolder>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>

CodeBehind:

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                DataTable dt = new DataTable();
                dt.Columns.AddRange(new DataColumn[2] { new DataColumn("id",typeof(int)),
                    new DataColumn("Comment", typeof(string)) });
                dt.Rows.Add(1, "Comment1");
                dt.Rows.Add(2, "Comment2");               
                GridView1.DataSource = dt;
                GridView1.DataBind();
            }
        }
        public class CreateUserButton
        {
            public Button CreateUser1Button()
            {                           
                Button bt = new Button();
                bt.Text = "Button1";
                return bt;

            }
        }
        protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                PlaceHolder ph = (PlaceHolder)e.Row.FindControl("PlaceHolder1");
                CreateUserButton cub = new CreateUserButton();
                Button bt = cub.CreateUser1Button();
                ph.Controls.Add(bt);
            }
        } 

Screenshots as below:

Hope this can help you. If you have any question and confusion about the problem. Please don't hesitate to let me know.

Best regards
Cathy

Answer 2

User-218090889 posted

Hi Cathy Zou, I quite appreciate your contribution, I understand your code, but I have further Issue. In a situation where I want to create four Buttons with their click event, and the button creation method will be called to add the button in the same placeHolder one at a time on demand. How do I go about that?

Thanks
Enzyme

Answer 3

User-707554951 posted

Hi Enzyme,

From your description, you want to  dynamically create four button with click event, if that is the case, you have to save the button in page load event or pre_init event. I make an example. I suggest you could refer to it.

<asp:Panel runat="server" ID="panel1" Height="300px" Width="400px">
                       <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
                </asp:Panel>

Codebehind:

protected int NumberOfControls
        {
            get { return Convert.ToInt32(ViewState["NumControls"]); }
            set { ViewState["NumControls"] = value; }
        }

        protected void Page_Load(object sender, System.EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                //Initiate the counter of dynamically added controls
                this.NumberOfControls = 0;
            }
            else
            {
                //Controls must be repeatedly be created on postback
                this.createControls();
            }
        }
        protected void Button1_Click(object sender, EventArgs e)
        {
            this.NumberOfControls = 4;
            Page_Load(sender, e);
        }

        private void createControls()
        {
            int count = this.NumberOfControls;

            for (int i =2; i <= count +1; i++)
            {
                Button but = new Button();
                but.ID = "button" + i.ToString();

                but.Width = 20;
                but.Text = i.ToString();
                but.Attributes.Add("runat", "server");

                but.Click += new EventHandler(button_click);

                panel1.Controls.Add(but);
            }
        }
        private void button_click(object sender, EventArgs e)
        {
            dynamic btclicked = (Button)sender;
            btclicked.BackColor = Color.DarkGray;

        }

Hope this can help you. If you have any question and confusion about the problem. Please don't hesitate to let me know.

Best regards
Cathy