h:selectOneRadio 的布局可以是水平的也可以是垂直的,所以我可以做一些自定义布局的方法吗?例如,不是显示 8 个单选按钮,而是将它们显示在 2 行中,每行 4 个?请在 PrimeFaces p:selectOneRadio 解决方案旁边提供您的答案,它使用 CSS3 导致 IE8 以矩形显示单选按钮。
最佳答案
不完全是这样,但你可以使用 Tomahawk's <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>
不适合,因为它在 View 渲染期间运行,因此最终作为 <h:panelGrid>
的单列结束,您需要使用纯 HTML <table>
代替)
关于jquery - 如何自定义布局 h :selectOneRadio,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11255509/