ASP.net Dynamic Button click event not working with second foreach loop

Question

Can anyone solve this problem? I want to get the items details by its category by clicking the category first then click the item button. When I click Categories, it shows the items. But then when I click the foreach created item button its just refreshing and not firing the BtnItem_Click Event. I am beginner with c# I don't know why is that happen. Thank you so much in advance.

Here is my code:

    protected void Page_Init(object sender, EventArgs e)
            {
                getcategories();
            }

private void getcategories()
    {
        try
        {
            CategoryModel model = new CategoryModel();
            List<TblCategory> categories = model.GetAllCategory();
            if (categories != null)
            {
                foreach (TblCategory category in categories)
                {

                    Button btnCategory = new Button();

                    btnCategory.Text = category.CategoryName;

                    btnCategory.ID = category.Id.ToString();

                    btnCategory.CssClass = category.BtnColor;

                    btnCategory.Click += BtnCategory_Click;

                    pnlcategories.Controls.Add(btnCategory);
                }
            }
            else
            {
                pnlcategories.Controls.Add(new Literal { Text = "No Categories found!" });
            }

            }
        catch (Exception ex)
        {
            alerterror.Visible = true;
            lblerror.Visible = true;
            lblerror.Text = "Error: " + ex;
        }
    }

    private void BtnCategory_Click(object sender, EventArgs e)
    {
            try
            {
                List<Control> listControls = pnlitem.Controls.Cast<Control>().ToList();

                foreach (Control control in listControls)
                {
                    pnlitem.Controls.Remove(control);
                    control.Dispose();
                }

                Button btn = sender as Button;
                string cssclass = btn.CssClass;
                string Id = btn.ID.ToString();

                var selectcategory = (from p in db.TblItems
                                   where p.CategoryId == Id
                                   select p).ToList();

                if (selectcategory != null)
                {
                    foreach (TblItem item in selectcategory)
                    {
                        Button btnItem = new Button();

                    btnItem.Text = item.ItemName;

                    btnItem.ToolTip = "P" + item.ItemPrice.ToString("0.00");

                    btnItem.CssClass = cssclass;

                    btnItem.ID = item.Id;

                    btnItem.Click += BtnItem_Click;

                        pnlitem.Controls.Add(btnItem);
                    }
                }
            }
            catch (Exception ex)
            {
                alerterror.Visible = true;
                lblerror.Visible = true;
                lblerror.Text = "Error: " + ex;
            }
    }
    private void BtnItem_Click(object sender, EventArgs e) // <== this is not triggering
    {
        alertsuccess.Visible = true;
        lblsuccess.Visible = true;
        lblsuccess.Text = "Trigger success!";
    }

and here is my html form:

×

<div id="alerterror" runat="server" class="alert alert-danger alert-lg fade in w3-card-4" visible="false">
    <span class="close" data-dismiss="alert">&times;</span>
    <asp:Label ID="lblerror" runat="server" Visible="false"></asp:Label>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Panel CssClass="pnlcat" ID="pnlcategories" runat="server" Wrap="true">
        </asp:Panel>

        <asp:Panel ID="pnlitem" runat="server" CssClass="pnlprod" Wrap="true" BorderStyle="Solid" BorderWidth="1px">
        </asp:Panel>
    </ContentTemplate>
</asp:UpdatePanel>

Your dynamically created category buttons work because you are creating them in Page_Init. They get recreated on postback before the click events for the button fires so the event works properly. Your item buttons, however, are created in the click handler for the category, and are not re-instantiated at postback before the page tries to fire the click; and they do not work. — Bert
– Bert, Commented Aug 10, 2016 at 5:26
Thank you Bert Evans I don't want to be spoon feed here but I just want to see how it will be coded or what is the proper way of coding it. — John Mark Ondivilla
– John Mark Ondivilla, Commented Aug 10, 2016 at 5:36
Do you have to create the buttons dynamically? I would recommend using a data bound control. A simple repeater could create your buttons for you based on the categories. — Bert
– Bert, Commented Aug 10, 2016 at 5:59

Bert · Accepted Answer · 2016-08-10 06:17:39Z

Here is how I might do this idiomatically with web forms. Bear in mind, I am creating some dummy data you would obviously get in a different way.

I'm using a Repeater to list the buttons, primarily because that is all you are doing in your code above, but you would probably really want to use a GridView to list your category and item data.

public class Category
{
    public int Id { get; set; }
    public string Name { get; set; }
}
public class Item
{
    public int Id { get; set; }
    public string ItemName { get; set; }
    public decimal ItemPrice { get; set; }
    public int CategoryId { get; set; }
}
public Category[] Categories
{
    get
    {
        return new Category[]
        {
            new Category {Id=1, Name="Category One" },
            new Category {Id=2, Name="Category Two" },
            new Category {Id=3, Name="Category Three" },
        };
    }
}
public Item[] Items
{
    get
    {
        return new Item[]
        {
            new Item { Id=1, CategoryId = 1, ItemName="Item 1", ItemPrice=10.00M},
            new Item { Id=2, CategoryId = 1, ItemName="Item 2", ItemPrice=10.00M},
            new Item { Id=3, CategoryId = 1, ItemName="Item 3", ItemPrice=10.00M},
            new Item { Id=4, CategoryId = 2, ItemName="Item 4", ItemPrice=10.00M},
            new Item { Id=5, CategoryId = 2, ItemName="Item 5", ItemPrice=10.00M},
            new Item { Id=6, CategoryId = 2, ItemName="Item 6", ItemPrice=10.00M},
            new Item { Id=7, CategoryId = 3, ItemName="Item 7", ItemPrice=10.00M},
            new Item { Id=8, CategoryId = 4, ItemName="Item 8", ItemPrice=10.00M},

        };
    }
}

void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        CategoryRepeater.DataSource = Categories;
        CategoryRepeater.DataBind();
    }
}
protected void OnCategoryButtonClick(object sender, EventArgs e)
{
    var button = sender as Button;
    var categoryId = Int32.Parse(button.CommandArgument);
    ItemRepeater.DataSource = Items.Where(i => i.CategoryId == categoryId);
    ItemRepeater.DataBind();
}

And for markup:

<asp:Panel runat="server" ID="CategoryPanel">
    <asp:Repeater runat="server" ID="CategoryRepeater">
        <ItemTemplate>
            <asp:Button runat="server" ID="CategoryButton" Text='<%# Eval("Name") %>' OnClick="OnCategoryButtonClick" CommandArgument='<%# Eval("Id") %>' />
        </ItemTemplate>
    </asp:Repeater>
</asp:Panel>
<asp:Panel runat="server" ID="ItemsPanel">
    <asp:Repeater runat="server" ID="ItemRepeater">
        <ItemTemplate>
            <asp:Button runat="server" ID="ItemButton" Text='<%# Eval("ItemName") %>' ToolTip='<%# Eval("ItemPrice") %>' />
        </ItemTemplate>
    </asp:Repeater>
</asp:Panel>

I think this is the solution. My problem only is I don't really know the other way to do it. Your solution fits on what I am asking. Thank you so much for fast response Mr Bert Evans.
You're welcome. There is one thing I wanted to mention; I answered the question with an ASP.NET Web Forms answer, because that is how you asked the question. However, much of the ASP.NET world has moved on these days to ASP.NET MVC, and I don't think Web Forms is supported in the latest version of ASP.NET (Core). If you have control over what you use, you may want to consider looking into MVC.

Collectives™ on Stack Overflow

ASP.net Dynamic Button click event not working with second foreach loop

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related