Web Image Buttons inside a Container

I have a web Container which displays some dynamically created small containers representing retrieved records, when there are more small containers created than the big container can display, there is a scroll bar on the right. There are a few Images as buttons in the small container to act different functions. How can I detect which button is being pressed? I would like to show another web dialog for record details when the user click on the small container area other than the buttons area. Thanks.

First of all, on the containers that represent the data, create a new event definition for each of the buttons and raise those events when they are pushed. This moves all of the events up to the container level and makes this a lot less complicated.

Once that’s done, you can use AddHandler to direct the new events to a method on the parent view when you add the containers with EmbedWithin.

Just remember to call RemoveHandler for each of the events when Removing them as well.

Thanks Greg. Just don’t understand why I need to push the events back to the parent container? After some testings, the only problem left is: image A and image B is within Container C, they all have their mouse up events, when I click on A or B, C also fires. How can I separate them?

Exactly what I said. Raise them to the parent container either on different named events, or on a single event where you pass a reference of the control.

If you don’t do it this way, the contents of the container will need to know too much about the control or page on which the container resides at any given time. It may not hurt you now, but it certainly will if/when you decide you want to reuse this container later.

Yes, I followed your instructions. I have created 3 events, 2 for the 2 buttons and 1 for the entire record. Handlers are added in the parent container. But still, when I click on A or B, the event for the button and the entire record fire together.

| A |
| B |
| |
| |

What I mean is the Image Buttons seem overlapping the area with the container, so when I click on the Image Button, mouse down event also trigger for the Container. I tried to detect the x and y passed to the Mouse Down event, the value for the Y value looks strange and if the containers within the parent Container scrolls, the Y appears as negative value. So I cant use the X and Y to exclude the image button areas inside the mouse down event of the container.