OnClick Event for panel which is inside a repeater

Question

<asp:Panel id="contactsListContainer" runat="server">
        <asp:Repeater ID="contactsListRepeater" runat="server">
            <ItemTemplate>
                <asp:Panel CssClass="contactsList" ID="contactList" runat="server" OnClick="contactLink_Click" CommandArgument='<%# ((AddressBook.Employee)Container.DataItem).Id %>' CausesValidation="false">
                    <asp:Label ID="lblContactName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "Name") %>'></asp:Label>
                    <asp:Label ID="lblContactEmail" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "Email") %>'></asp:Label>
                    <asp:Label ID="lblContactMobile" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "MobileNumber") %>'></asp:Label>
                </asp:Panel>
            </ItemTemplate>
        </asp:Repeater>
    </asp:Panel>

I want to add onclick event for contactlist panel. how can i add it.

This is the code what is to be done when that panel is clicked.

 protected void contactLink_Click(object sender, EventArgs e)
    {
        contactsForm.Style.Add("display", "none");
        detailsContainer.Style.Add("display", "block");
        LinkButton btn = (LinkButton)sender;
        SelectEmpId = int.Parse(btn.CommandArgument);
        LinkButton contactListLinkButton = getSelctedLinkButton();
        contactListLinkButton.Style.Add("background-color", "#CEE7F2");
        Employee employee = GetEmployee(SelectEmpId);
        lblDetailName.Text = employee.Name;
        lblDetailAddress.Text = employee.Address;
        lblDetailMobile.Text = employee.MobileNumber;
        lblDetailLandline.Text = employee.LandLineNumber;
        lblDetailEmail.Text = employee.Email;
        lblDetailWebsite.Text = employee.Website;
        lblDetailAddress.Text = employee.Address;
    }

score 0 · Answer 1 · edited May 23 '17 at 11:53

0

There is no OnClick event for Asp.NET Panel, try this instead:

You can refer to this solution: https://stackoverflow.com/a/20540854/4779385

Hope it helps!

edited May 23 '17 at 11:53

Community

1
1

answered Feb 03 '17 at 04:59

mindOfAi

4,412
2
16
27

This won't work inside a repeater as in his example, because he will have multiple items with the same client-side ID and the jQuery selector will not work. – sh1rts Feb 03 '17 at 05:08
Yeah, figures. Updated it, though. – mindOfAi Feb 03 '17 at 05:13

score 0 · Answer 2 · answered Feb 03 '17 at 05:17

The <asp:Panel> does not have a Click event you can handle.

Although you will probably have some CSS work to do, a good approach is to wrap the content you want to be server-clickable inside an HTML anchor, i.e.

<a id="anchor" runat="server">
  .. your stuff
</a>

You can add a Clicked handler to the anchor inside the repeater/grid's ItemDataBound event, and specify your contactLink_Click handler is the one to handle the event for all anchors/panels in the repeater/grid.

(this example is from a repeater, adapt it for a GridView)

void contactsListRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
    var item = e.Item;

    if (item.ItemType == ListItemType.AlternatingItem || item.ItemType == ListItemType.Item)
    {
        var anchor = item.FindControl("anchor") as HtmlAnchor;
        anchor.ServerClick += contactLink_Click;
    }
}

Note that the sender will be the anchor that raises the click event, so you can drill down into the correct child controls from sender (if you need to)

OnClick Event for panel which is inside a repeater

2 Answers2