如何在h:dataTable中使用h:selectOneRadio来选择单行？

Question

我有表格中显示的页面列表.每个页面都有属性homePage,我想在数据表中有一列单选按钮要在此属性上绑定,用户只能检查一个值.如何在服务器端获得此值？

我看到了一些例子如下:http: //jforum.icesoft.org/JForum/posts/list/14157.page,但我想知道在这种情况下最佳做法是什么.

Answer 1

根据JSF规范问题329,我终于为JSF 2.3实现了它.使用新group属性,您现在可以在转发器组件中对单选按钮进行分组.

<h:dataTable value="#{bean.items}" var="item">
    <h:column>
        <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
            <f:selectItem itemValue="#{item}" />
        </h:selectOneRadio>
    </h:column>
</h:dataTable>

它将按照Mojarra 2.3.0-m07提供.

在JSF 2.3之前,使用标准JSF并不是一件容易的事<h:selectOneRadio>.基本上,每行中的单选按钮需要使用相同的输入相互分组,name以便在您选择其他按钮时取消选中其他单选按钮.但它们没有被分组,它们都有自己的name,所以其他单选按钮永远不会被取消选中.

像PrimeFaces这样的组件库通过提供特殊的属性或列组件来解决它.另请参见此展示示例,该示例使用a <p:column selectionMode="single">生成单个选择列.所选值由selection属性引用<p:dataTable>.如果您已经在使用组件库并且它已经有了这样的组件,那么您应该使用它.

在标准的JSF中<h:dataTable>,<h:selectOneRadio>您需要引入如下的JavaScript解决方法,取消选中同一列中的所有其他单选按钮:

<h:dataTable value="#{bean.items}" var="item">
    <h:column>
        <h:selectOneRadio valueChangeListener="#{bean.setSelectedItem}"
            onclick="dataTableSelectOneRadio(this);">
            <f:selectItem itemValue="null" />
        </h:selectOneRadio>
    </h:column>
    ...
</h:dataTable>

同

public void setSelectedItem(ValueChangeEvent event) {
    FacesContext context = FacesContext.getCurrentInstance();
    selectedItem = context.getApplication().evaluateExpressionGet(context, "#{item}", Item.class);
}

和

function dataTableSelectOneRadio(radio) {
    var radioId = radio.name.substring(radio.name.lastIndexOf(':'));

    for (var i = 0; i < radio.form.elements.length; i++) {
        var element = radio.form.elements[i];

        if (element.name.substring(element.name.lastIndexOf(':')) == radioId) {
            element.checked = false;
        }
    }

    radio.checked = true;
}