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

前端之家收集整理的这篇文章主要介绍了jsf – 渲染表元素,如何避免这个?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有没有办法告诉JSF它不应该呈现< table>元素使用< h:selectOneRadio>?
我不使用表,这在这种情况下绝对没有意义.

任何帮助是赞赏!

解决方法

具有组属性的JSF 2.3

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

  1. <!-- Just markup them the way you want! -->
  2. <ul>
  3. <ui:repeat id="items" value="#{bean.items}" var="item">
  4. <li>
  5. <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
  6. <f:selectItem itemValue="#{item}" />
  7. </h:selectOneRadio>
  8. </li>
  9. </ui:repeat>
  10. </ul>

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

  1. <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
  2. <f:selectItems value="#{bean.availableItems}" />
  3. </h:selectOneRadio>
  4. <h:selectOneRadio group="foo" />
  5. <h:selectOneRadio group="foo" />
  1. <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
  2. <f:selectItem itemValue="one" />
  3. <f:selectItem itemValue="two" />
  4. <f:selectItem itemValue="three" />
  5. </h:selectOneRadio>
  6. <h:selectOneRadio group="foo" />
  7. <h:selectOneRadio group="foo" />
  1. <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
  2. <f:selectItem itemValue="one" />
  3. </h:selectOneRadio>
  4. <h:selectOneRadio group="foo">
  5. <f:selectItem itemValue="two" />
  6. </h:selectOneRadio>
  7. <h:selectOneRadio group="foo">
  8. <f:selectItem itemValue="three" />
  9. </h:selectOneRadio>
  1. <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
  2. <f:selectItem itemValue="one" />
  3. </h:selectOneRadio>
  4. <h:selectOneRadio group="foo" value="#{otherBean.selectedItem}">
  5. <f:selectItem itemValue="two" />
  6. </h:selectOneRadio>
  7. <h:selectOneRadio group="foo" value="#{lastBean.selectedItem}">
  8. <f:selectItem itemValue="three" />
  9. </h:selectOneRadio>

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

具有直通元素的JSF 2.2

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

  1. <html xmlns="http://www.w3.org/1999/xhtml"
  2. xmlns:jsf="http://xmlns.jcp.org/jsf"
  3. xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
  4. xmlns:a="http://xmlns.jcp.org/jsf/passthrough">
  5.  
  6. ...
  7.  
  8. <!-- Just markup them the way you want! -->
  9. <ul>
  10. <ui:repeat id="items" value="#{bean.items}" var="item">
  11. <li>
  12. <input type="radio" jsf:id="item" a:name="#{hiddenItem.clientId}"
  13. value="#{item}" a:checked="#{item eq bean.selectedItem ? 'checked' : null}" />
  14. <h:outputLabel for="item" value="#{item}" />
  15. </li>
  16. </ui:repeat>
  17. </ul>
  18.  
  19. <!-- This one won't display anything. -->
  20. <h:inputHidden id="selectedItem" binding="#{hiddenItem}" value="#{bean.selectedItem}"
  21. 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 ;.

  1. <html ... xmlns:p="http://primefaces.org/ui">
  2.  
  3. <!-- This one won't display anything. -->
  4. <p:selectOneRadio id="foo" value="#{bean.selectedFoo}" layout="custom">
  5. <f:selectItems value="#{bean.availableFoos}" />
  6. </p:selectOneRadio>
  7.  
  8. <!-- Just markup them the way you want! -->
  9. <ul>
  10. <li><p:radioButton for="foo" itemIndex="0" /></li>
  11. <li><p:radioButton for="foo" itemIndex="1" /></li>
  12. <li><p:radioButton for="foo" itemIndex="2" /></li>
  13. </ul>

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

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

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

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

例如.

  1. <html ... xmlns:t="http://myfaces.apache.org/tomahawk">
  2.  
  3. <!-- This one won't display anything. -->
  4. <t:selectOneRadio id="foo" value="#{bean.selectedFoo}" layout="spread">
  5. <f:selectItems value="#{bean.availableFoos}" />
  6. </t:selectOneRadio>
  7.  
  8. <!-- Just markup them the way you want! -->
  9. <ul>
  10. <li><t:radio for="foo" index="0" /></li>
  11. <li><t:radio for="foo" index="1" /></li>
  12. <li><t:radio for="foo" index="2" /></li>
  13. </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

猜你在找的HTML相关文章