带工具提示的radiogroup无法正常工作

时间:2017-03-15 14:35:18

标签: xpages xpages-ssjs

我遇到的问题与之前的问题相同: checkboxgroup returning only last selected value

但是这次只能从相同的数据中选择1个值,所以我想使用收音机代替复选框。

值来自viewScope选项的重复

<xp:repeat id="repeat4" rows="100" value="#{viewScope.choices}"
    indexVar="rownumber" var="row" first="0">

   <xp:radio id="radio1" groupName="selection">
       <xp:this.text><![CDATA[#{javascript:row[3]}]]></xp:this.text>
       <xp:this.value><![CDATA[#{viewScope.selected[rownumber]}]]></xp:this.value>
   </xp:radio>

   <xe:tooltip id="tooltip3" for="radio1">
        <xe:this.label><![CDATA[#{javascript:return viewScope.choices[rownumber].get(3)}]]></xe:this.label>
   </xe:tooltip>
</xp:repeat>

工具提示似乎正确但是:

1)如果我想要的话,我可以选择所有的收音机,而不是只选择一个

2)数据似乎没有更新(所以我不知道哪个盒子被选中)

3 个答案:

答案 0 :(得分:0)

问题1:

<强>更新

您必须为重复控件的每一行计算唯一的groupName。

您必须为所有单选按钮计算公共groupName。 并且存在问题,每个xp:radio控件将使用自己的组名进行渲染,让我们看一下渲染的html代码:

enter image description here

一种可能的解决方法是使用原生html:

<input id="radio1" type="radio" name="selection" value="#{viewScope.selected[rownumber]}">
</input>

如果您需要xp:radio按钮核心控件的全部功能,那么另一个选项可能是在渲染后重命名name按钮的xp:radio属性(例如,使用客户端javascript)

问题2:

我为此目的使用valueChangeListener

示例(来自我自己的项目):

的XPage:

<xp:repeat var="entry" rows="30" value="#{accessBean.entries}" removeRepeat="true" repeatControls="false">

    <xp:radio id="rbReadAccess" rendered="#{javascript:docData.isEditable()}"
        title="Set read access" value="#{entry.accessLevelAsString}" selectedValue="READACCESS"
        groupName="#{entry.name}" valueChangeListener="#{accessBean.accessLevelChanged}">
        <xp:eventHandler event="onchange" submit="true" refreshMode="partial"
            refreshId="pnlAccessControl">
        </xp:eventHandler>
    </xp:radio>

    <xp:radio id="rbEditAccess" rendered="#{javascript:docData.isEditable()}"
        title="Set edit access" value="#{entry.accessLevelAsString}" selectedValue="EDITACCESS"
        groupName="#{entry.name}" valueChangeListener="#{accessBean.accessLevelChanged}">
        <xp:eventHandler event="onchange" submit="true" refreshMode="partial"
            refreshId="pnlAccessControl">
        </xp:eventHandler>
    </xp:radio>

    <xp:radio id="rbFullAccess" rendered="#{javascript:docData.isEditable()}"
        title="Set full access" value="#{entry.accessLevelAsString}" selectedValue="FULLACCESS"
        groupName="#{entry.name}" valueChangeListener="#{accessBean.accessLevelChanged}">
        <xp:eventHandler event="onchange" submit="true" refreshMode="partial"
            refreshId="pnlAccessControl">
        </xp:eventHandler>
    </xp:radio>

</xp:repeat>

AccessControlBean:

public class AccessControlBean implements Serializable {

    public Set<AccessControlEntry> getEntries() {

        Set<AccessControlEntry> entries = new TreeSet<AccessControlEntry>(accessControlUserService.getEntries());
        entries.addAll(accessControlGroupService.getEntries());

        return entries;
    }

    public void accessLevelChanged(ValueChangeEvent valueChangeEvent) {

        XspInputRadio component = (XspInputRadio) valueChangeEvent.getComponent();

        System.out.println("phaseId: " + valueChangeEvent.getPhaseId());

        System.out.println("accessLevelChanged");
        System.out.println(component.getGroupName());
        System.out.println("oldValue: " + valueChangeEvent.getOldValue());
        System.out.println("newValue: " + valueChangeEvent.getNewValue());

    }

}

的AccessControlEntry:

public class AccessControlEntry implements Comparable<AccessControlEntry> {

    // Enumerations

    public static enum AccessLevel {
        READACCESS, 
        EDITACCESS,
        FULLACCESS;
    }

    // Fields

    private String name;
    private AccessLevel accessLevel;
    private boolean accessLevelRestricted = false;

    // Constructors

    public AccessControlEntry(String name, AccessLevel accessLevel) {
        this.name = name;
        this.accessLevel = accessLevel;
    }

    // Getter & Setter

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public AccessLevel getAccessLevel() {
        return accessLevel;
    }

    public void setAccessLevel(AccessLevel accessLevel) {
        this.accessLevel = accessLevel;
    }

    // nessecary for EL (managed bean)
    public String getAccessLevelAsString() {
        return accessLevel.toString();
    }

    // nessecary for EL (managed bean)
    public void setAccessLevelAsString(String accessLevel) {
        this.accessLevel = AccessLevel.valueOf(accessLevel.toUpperCase());
    }

    // Operations

    public boolean isReadAccess() {
        return accessLevel == AccessLevel.READACCESS;
    }

    public void setEditAccess(boolean editAccessRestricted) {
        accessLevel = AccessLevel.EDITACCESS;
        accessLevelRestricted = editAccessRestricted;
    }

    public boolean isEditAccess() {
        return accessLevel == AccessLevel.EDITACCESS;
    }

    public boolean isEditAccessRestricted() {
        return isEditAccess() && accessLevelRestricted;
    }

    public void setFullAccess(boolean fullAccessRestricted) {
        accessLevel = AccessLevel.FULLACCESS;
        accessLevelRestricted = fullAccessRestricted;
    }

    public boolean isFullAccess() {
        return accessLevel == AccessLevel.FULLACCESS;
    }

    public boolean isFullAccessRestricted() {
        return isFullAccess() && accessLevelRestricted;
    }

    public int compareTo(AccessControlEntry aControlEntry) {
        return getName().compareTo(aControlEntry.getName());
    }

    @Override
    public String toString() {
        return getClass().getSimpleName() + ": name=\"" + name + 
                "\", accessLevel=\"" + accessLevel +
                "\", isEditAccessRestricted=\"" + isEditAccessRestricted() + 
                "\", isFullAccessRestricted=\"" + isFullAccessRestricted() + "\"";
    }

}

答案 1 :(得分:0)

您是否可以使用广播组?

<xp:radioGroup id="radioGroup1"></xp:radioGroup>

答案 2 :(得分:0)

将此onClientLoad CSJS代码添加到XPage:

<xp:eventHandler
    event="onClientLoad"
    submit="false">
    <xp:this.script><![CDATA[
        dojo.query("input").forEach(function(node){
            var attr = node.getAttributeNode("name");
            if (attr.value.indexOf(':selection') >= 0) {
                attr.value = 'selection';
            }
        });
    ]]></xp:this.script>
</xp:eventHandler>

它“修复”输入元素的name属性,因此它们获得所有相同的名称“selection”而没有“repeat”-part:

来自

enter image description here

enter image description here