jquery - カスタム レイアウト h:selectOneRadio の方法

Question

h:selectOneRadio のレイアウトは水平または垂直のいずれかになる可能性があるため、カスタム レイアウトを行う方法はありますか。例えば8個のラジオボタンを表示する代わりに、各行に4つずつ2行で表示しますか? PrimeFaces p:selectOneRadio ソリューションの横に答えを入力してください。CSS3 を使用して、IE8 にラジオ ボタンを長方形の形で表示させます。

Answer 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>）