Как настроить макет h: selectOneRadio

расположение h: selectOneRadio может идти горизонтально или вертикально, так что есть способ, которым я могу сделать какой-то пользовательский макет. Например, вместо того, чтобы отображать 8 переключателей, отобразите их в 2 строки по 4 в каждой строке? Предоставьте свой ответ рядом с пунктом PrimeFaces p: selectOneRadio, он использует CSS3, заставляя IE8 отображать радиокнопку в форме прямоугольника.

ОТВЕТЫ

Ответ 1

Это не совсем так, но вы можете использовать Tomahawk <t:selectOneRadio> с атрибутом layout, установленным на "spread", чтобы иметь разметку рендеринга переключателей. Затем вы можете использовать <t:radio>, чтобы поместить отдельные переключатели в разметке так, как вы хотите, например, в <h:panelGrid columns="4">.

например.

<t:selectOneRadio id="foo" value="#{bean.selectedItem}" layout="spread">
    <f:selectItems value="#{bean.availableItems}" />
</t:selectOneRadio>

<h:panelGrid columns="4">
    <t:radio for="foo" index="0" />
    <t:radio for="foo" index="1" />
    <t:radio for="foo" index="2" />
    <t:radio for="foo" index="3" />

    <t:radio for="foo" index="4" />
    <t:radio for="foo" index="5" />
    <t:radio for="foo" index="6" />
    <t:radio for="foo" index="7" />
</h:panelGrid>

или даже если количество переключателей не указано

<h:panelGrid columns="4">
    <c:forEach items="#{bean.availableItems}" varStatus="loop">
        <t:radio for="foo" index="#{loop.index}" />
    </c:forEach>
</h:panelGrid>

(обратите внимание, что <ui:repeat> не подходит, поскольку он запускается во время визуализации рендеринга и, таким образом, заканчивается как один столбец <h:panelGrid>, вам нужно вместо этого использовать простой HTML <table>)