A common UX pattern I’ve run into in my career is a data table where clicking on a row routes to a new page with more details on the record. What’s the best way to handle this? I can think of three approaches

Option 1: Route to the details page on click with JavaScript. This is my least favorite because users are unable to wheel-click the table rows to open in new tab since there’s not actually an anchor tag. It’s usually the easiest to implement, however

Option 2: Put an anchor tag in each row either by wrapping each row or absolutely positioning an anchor inside. The downside of this approach is it makes selecting content inside the cells hard. This is the route I usually go with


Option 3: Add a column to the table specifically for the link. This is probably the cleanest technically, but could cause problems for wide tables where horizontal real estate is an issue

Sign in to participate in the conversation
Mastodon for Tech Folks

This Mastodon instance is for people interested in technology. Discussions aren't limited to technology, because tech folks shouldn't be limited to technology either!