Recursive event handler decoders

In our production code we need to render user-declared html with a click handler that can identify which part of the provided html was clicked. We take advantage of event bubbling, but as event objects are recursive, we need to use a recursive decoding pattern to extract the data (from the dataset field) that we want.

The technique is documented on my blog.

Feedback welcome :slight_smile:


Another way might be to set data- tags in the Html. Then put a mouse handler on whatever contains that, and let all events bubble up to it. From the contents of the data tags, figure out what was clicked, what action should result and so on.

Thanks for writing it down. Will come in handy!

data-my-stop will become myStop

How about camelcasing all data-* so they are identical strings in the codebase. i.e. data-myStop ?

that’s what I’m doing in fact this blog post is really about the decoder of an event that has bubbled up like that

1 Like

This is probably a good approach in the case when we want to close a popover on an “external” (that doesn’t happen inside of it) click.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.