h:selectOneRadio renders all select items in one line, how to render each in new line?

Question

I have a selectOneRadio tag and all radio button options are displayed on one row. How can I make it one option per row/line?

Answer 1

To learn about tag's behavior and all of its available attributes, a good starting point is the tag documentation. Here's an extract relevance from the <h:selectOneRadio> tag documentation:

[...]

Encode Behavior

Render a "table" element. If the "styleClass" is specified, render the value of the "styleClass" attribute as the value of the "class" attribute on the "table" element. If the "style", "border" attributes are specified, pass them thru and render their values as the "style" and "border" attributes on the "table", respectively. If the "layout" attribute is specified, and its value is "pageDirection", render the children elements vertically, otherwise horizontally, in the table. If any of the children are an instance of SelectItemGroup, render them as a nested table. Each of the children are ultimately rendered as follows. Render an "input" element of "type" "radio" for each child component. Render the "name" attribute on the "input" element with the value of the clientId of the component. Render an "id" attribute on the "input" element. Each "id" value must be unique. If the current SelectItem.isDisabled() returns true, render "disabled" as the value of the "disabled" attribute.

[...]

Note the emphasis. There's your answer.

<h:selectOneRadio ... layout="pageDirection">