User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
We're building a grid view in our product UI which currently has a checkbox per row for selection. Action panel appears on top of the grid once you select a row.
However, you can perform action on a single row at a time only. We were wondering if we should replace the checkboxes with radio buttons, since it's a single select use case.
Appreciate design help for this.
Madhura
I would remove the radio button and checkbox.
Then add a button (called actions or even an icon like an ellipsis) which displays a popover inline with where you have clicked. This is so you can still see the row that you are performing actions on at the same time as the list of actions.
If every row will always have an 'actions' this could even appear on hover of the row (if visual clutter is an issue with it always being visible on every row) - but make sure you consider an alternative for touch screen if you do this.
If you mean the input field itself (as a visible element) then the answer is none of them, you don't need to add it since the whole row will be selectable, therefore adding a redundant input element will cause some non needed friction.
If you mean the form element disguised as a clickable row (which is a very common way of doing this), then as you say, it should be a radio button, because you can select only one item at a time. Otherwise, if you use checkboxes, you'd be allowing multiple selections.
However, keep in mind that this is not the only way to do it, and making the row active on click should be enough. Since you click and fire, additional elements are redundant and not needed at all, and users will discover the affordance with the first interaction
