jsf – 渲染表元素,如何避免这个？

HTML 2020-01-21

有没有办法告诉JSF它不应该呈现< table>元素使用< h：selectOneRadio>？
我不使用表,这在这种情况下绝对没有意义.

任何帮助是赞赏！

解决方法

具有组属性的JSF 2.3

根据JSF spec issue 329,我已经向< h：selectOneRadio>添加了一个新的组属性这应该使这一切都不那么繁琐.在父UIForm中具有相同组值的所有单选按钮组件将彼此分组.此外,如果选择项目具有非空标签,它们也不会在单选按钮本身和可选标签之外提供任何标记.如果有的话,标签会在单选按钮之后直接出现.

<!-- Just markup them the way you want! -->
<ul>
    <ui:repeat id="items" value="#{bean.items}" var="item">
        <li>
            <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
                <f:selectItem itemValue="#{item}" />
            </h:selectOneRadio>
        </li>
    </ui:repeat>
</ul>

以下情况也是可能的.当具有相同组的多个组件,并且值属性和/或UISelectItem子项不存在时,则将引用该组的第一个组件.

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItems value="#{bean.availableItems}" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" />
<h:selectOneRadio group="foo" />

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItem itemValue="one" />
    <f:selectItem itemValue="two" />
    <f:selectItem itemValue="three" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" />
<h:selectOneRadio group="foo" />

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItem itemValue="one" />
</h:selectOneRadio>
<h:selectOneRadio group="foo">
    <f:selectItem itemValue="two" />
</h:selectOneRadio>
<h:selectOneRadio group="foo">
    <f:selectItem itemValue="three" />
</h:selectOneRadio>

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItem itemValue="one" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" value="#{otherBean.selectedItem}">
    <f:selectItem itemValue="two" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" value="#{lastBean.selectedItem}">
    <f:selectItem itemValue="three" />
</h:selectOneRadio>

根据2.3.0-m07,它将在Mojarra上市.

具有直通元素的JSF 2.2

如果您已经使用JSF 2.2,请使用其新的passthrough elements/attribtues 功能,从而将name属性显式设置为passthrough属性.为了在模型中设置提交的值,您只需要一个额外的< h：inputHidden>.

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:jsf="http://xmlns.jcp.org/jsf"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:a="http://xmlns.jcp.org/jsf/passthrough">

...

<!-- Just markup them the way you want! -->
<ul>
    <ui:repeat id="items" value="#{bean.items}" var="item">
        <li>
            <input type="radio" jsf:id="item" a:name="#{hiddenItem.clientId}"
                value="#{item}" a:checked="#{item eq bean.selectedItem ? 'checked' : null}" />
            <h:outputLabel for="item" value="#{item}" />
        </li>
    </ui:repeat>
</ul>

<!-- This one won't display anything. -->
<h:inputHidden id="selectedItem" binding="#{hiddenItem}" value="#{bean.selectedItem}"
    rendered="#{facesContext.currentPhaseId.ordinal ne 6}" />

深入的技术解释可以在这个博客中找到：Custom layout with h:selectOneRadio in JSF 2.2.

PrimeFaces(JSF 2.x)

如果您恰好使用PrimeFaces,那么您也可以使用<p:selectOneRadio layout="custom">< p：radioButton&gt ;.

<html ... xmlns:p="http://primefaces.org/ui">

<!-- This one won't display anything. -->
<p:selectOneRadio id="foo" value="#{bean.selectedFoo}" layout="custom">
    <f:selectItems value="#{bean.availableFoos}" />
</p:selectOneRadio>

<!-- Just markup them the way you want! -->
<ul>
    <li><p:radioButton for="foo" itemIndex="0" /></li>
    <li><p:radioButton for="foo" itemIndex="1" /></li>
    <li><p:radioButton for="foo" itemIndex="2" /></li>
</ul>

您也可以循环使用可用的项目,您只需要在view build time期间执行：

<ul>
    <c:forEach items="#{bean.availableFoos}" varStatus="loop">
        <li><p:radioButton for="foo" itemIndex="#{loop.index}" /></li>
    </c:forEach>
</ul>

战斧(JSF 1.x或2.x)

如果您不在JSF 2.2上,或者如果您不喜欢PrimeFaces UI,请抓取Tomahawk’s <t:selectOneRadio>,其中显示与< h：selectOneRadio>相同的纯HTML输出,但支持layout =“spread”属性,以便您可以按照您想要的方式将项目按照<t:radio>进行.

例如.

<html ... xmlns:t="http://myfaces.apache.org/tomahawk">

<!-- This one won't display anything. -->
<t:selectOneRadio id="foo" value="#{bean.selectedFoo}" layout="spread">
    <f:selectItems value="#{bean.availableFoos}" />
</t:selectOneRadio>

<!-- Just markup them the way you want! -->
<ul>
    <li><t:radio for="foo" index="0" /></li>
    <li><t:radio for="foo" index="1" /></li>
    <li><t:radio for="foo" index="2" /></li>
</ul>

自定义渲染器

供应定制Renderer.这只是一点点工作.从第一个“参见”链接开始,如下所示：

也可以看看：

> How to override h:selectOneRadio renderer? Where is the renderer class in jsf-impl?
> Is it possible to use JSF to build clean CSS layouts without using tables?
> Render selectManyCheckbox without HTML table