John Mark Ondivilla John Mark Ondivilla - 4 months ago 29
ASP.NET (C#) Question

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

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>

Answer

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>