3

我想自定义<h:selectOneRadio>.

就我而言，我需要<h:selectManyCheckbox>在每个单选按钮之后放置一个。这是我到目前为止所拥有的：

<h:selectOneRadio value="#{user.Request}">
    <f:selectItem itemValue="Request1" itemLabel="Request1" />
    <f:selectItem itemValue="Request2" itemLabel="Request2" />
</h:selectOneRadio>

<h:selectManyCheckbox value="#{user.Request1}">
    <f:selectItem itemValue="Certificate1" itemLabel="Certificate1" />
    <f:selectItem itemValue="Certificate2" itemLabel="Certificate2" />
</h:selectManyCheckbox>

<h:selectManyCheckbox value="#{user.Request2}">
    <f:selectItem itemValue="Certificate3" itemLabel="Certificate3" />
    <f:selectItem itemValue="Certificate4" itemLabel="Certificate4" />
</h:selectManyCheckbox>

我试图将它们放在每个选择项之后：

 <h:selectOneRadio value="#{user.Request}">
    <f:selectItem itemValue="Request1" itemLabel="Request1" />
    <h:selectManyCheckbox value="#{user.Request1}">
        <f:selectItem itemValue="Certificate1" itemLabel="Certificate1" />
        <f:selectItem itemValue="Certificate2" itemLabel="Certificate2" />
    </h:selectManyCheckbox>
    <f:selectItem itemValue="Request2" itemLabel="Request2" />
    <h:selectManyCheckbox value="#{user.Request2}">
        <f:selectItem itemValue="Certificate3" itemLabel="Certificate3" />
        <f:selectItem itemValue="Certificate4" itemLabel="Certificate4" />
    </h:selectManyCheckbox>
</h:selectOneRadio>

但它没有用。这样做的正确方法是什么？

4

1 回答 1

4

标准 JSF 不支持此标记<h:selectOneRadio>。

有 JSF 组件库提供了更灵活的组件，例如Tomahawk<t:selectOneRadio layout="spread"><t:radio>：

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

<!-- This one won't display anything. -->
<t:selectOneRadio id="request" value="#{user.request}" layout="spread">
    <f:selectItem itemValue="#{1}" itemLabel="Request 1" />
    <f:selectItem itemValue="#{2}" itemLabel="Request 2" />
    <f:ajax render="requests" />
</t:selectOneRadio>

<!-- Just markup them the way you want! -->
<h:panelGroup id="requests" layout="block">
    <ul>
        <li>
            <t:radio for="request" index="0" />
            <h:selectManyCheckbox value="#{user.request1}" disabled="#{user.request != 1}">
                ...
            </h:selectManyCheckbox>
        </li>
        <li>
            <t:radio for="request" index="1" />
            <h:selectManyCheckbox value="#{user.request2}" disabled="#{user.request != 2}">
                ...
            </h:selectManyCheckbox>
        </li>
    </ul>
</h:panelGroup>

PrimeFaces有一个类似的组件，即<p:selectOneRadio layout="custom"><p:radioButton>：

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

<!-- This one won't display anything. -->
<p:selectOneRadio id="request" value="#{user.request}" layout="custom">
    <f:selectItem itemValue="#{1}" itemLabel="Request 1" />
    <f:selectItem itemValue="#{2}" itemLabel="Request 2" />
    <p:ajax update="requests" />
</p:selectOneRadio>

<!-- Just markup them the way you want! -->
<h:panelGroup id="requests" layout="block">
    <ul>
        <li>
            <p:radioButton for="request" itemIndex="0" />
            <h:selectManyCheckbox value="#{user.request1}" disabled="#{user.request != 1}">
                ...
            </h:selectManyCheckbox>
        </li>
        <li>
            <p:radioButton for="request" itemIndex="1" />
            <h:selectManyCheckbox value="#{user.request2}" disabled="#{user.request != 2}">
                ...
            </h:selectManyCheckbox>
        </li>
    </ul>
</h:panelGroup>

无论哪种方式，只需让disabled复选框组的属性检查当前选择的单选按钮值（我已经简单地将其更改为 a Long，但 anenum可能会更自记录），并使用通常的 ajax 魔法来部分更新视图在更改事件期间。

如果由于某种原因不能重用现有 JSF 组件库中的增强组件，那么您需要自己编写所有内容。最简单的方法是覆盖标准<h:selectOneRadio>渲染器以识别新layout属性，然后像上述组件一样相应地生成所需的 HTML 输出。另请参阅 ao如何覆盖 h:selectOneRadio 渲染器？jsf-impl 中的渲染器类在哪里？

于 2015-02-17T20:20:40.927 回答