Question

主要任务是选中一个复选框并获取索引并在编辑框中设置并继续进行，我成功地在编辑框中实现了所选索引，但我想让用户只选择一个日期

选中一个复选框后，我想取消选中其他选中的值，但在我的代码中我可以选中多个复选框，最近检查的值将存储在编辑框中，我尝试了一些客户端JavaScript但失败了，即使在视图范围方法中存储已检查的索引值也没有帮助我。带有重复控制复选框的代码如下。

 <?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">

    <xp:this.data>
        <xp:dominoDocument var="document1" formName="testing">
        </xp:dominoDocument>
    </xp:this.data>

    <xp:br></xp:br>
    <xp:repeat id="repeat1" rows="30" var="r" indexVar="i" first="0">
        <xp:this.value><![CDATA[#{javascript:var v:java.util.Vector = new java.util.Vector();
v.add('Date1');v.add('Date2');v.add('Date3');v.add('Date4');v.add('Date5');v.add('Date6');
return v;}]]></xp:this.value>
        <xp:br></xp:br>
        <xp:div id="checkDiv">



            <xp:checkBox id="checkBox1">

            <xp:eventHandler event="onchange" submit="true"
                refreshMode="partial" refreshId="checkDiv">
                <xp:this.action><![CDATA[#{javascript:if(getComponent("checkBox1").value == "true"){
//viewScope.put("IdValue",optionIndex2)
getComponent("finalDate").setValue(r);
//getComponent("checkBox1").getAttributes().put("true",optionIndex2);
}
else
getComponent("finalDate").setValue("");
}]]></xp:this.action>
            </xp:eventHandler></xp:checkBox>
            <xp:text escape="true" id="computedField1"
                value="#{javascript:r}">

            </xp:text>
        </xp:div>
        <xp:br></xp:br>
    </xp:repeat>
    <xp:inputText id="finalDate"></xp:inputText>
</xp:view>

我不知道，在客户端进行检查是最佳的，或者在服务器端进行检查会更好。需要了解如何只保留一个复选框。任何建议都会有所帮助

Answer 1

我建议你看一下这个视频：

http://www.notesin9.com/2011/04/01/notesin9-025-selecting-documents-from-a-repeat-control/

这是关于重复选择多个文档。我想只选择一个，你需要做的就是用一个变量替换我的ArrayList。因此，每个新选择都会覆盖最后一个，您一次只能选择一个文档。

注意我还使用了按钮和css来突出显示行...如果你想这样做，那么从按钮转换为复选框也不是什么大不了的事。

Answer 2

如果您退后一步重新评估所使用的控件和重复控制的选择，是否有更简单的方法？

除非没有包含更多代码，否则您希望让用户从字段名称列表中选择一个代码然后执行某些操作。我将使用单选按钮组或组合框，而不是重复控件和计算字段，然后处理该功能需求，而无需重复控件或计算字段。两者都允许计算选项。

如果您需要重复控制，因为重复中不仅仅包含名称列表，请再次选择专门用于确保单一选择的组件 - 按钮或单选按钮。我相信你可以在一个单选按钮上设置一个组名，这将满足你的要求。

复选框专为多选而设计。单选按钮是用于单选的组件。似乎复选框不是您正在寻找的功能的最佳选择。

Answer 3

经过一些研究，似乎可以使用jquery，通过将唯一的styleClass传递给根据重复控件生成的所有复选框。

因此，复选框中的第一个更改是styleClass，其计算方式为“return”“+ r;”那是索引，

接下来，我使用客户端JavaScript检查取消选中on事件。

CSJS：

 var textFieldValue = document.getElementById('#{id:finalDate}').value;
 if(textFieldValue != "")
 {
 $("."+textFieldValue).prop("checked", false);
 }

在服务器端JavaScript中，如果选中复选框为“true”，则设置条件上的文本字段值。

SSJS：

if(getComponent("checkBox1").getValue() == "true"){
getComponent("finalDate").setValue(""+r);
}
else
getComponent("finalDate").setValue("");

并且checkBox部分刷新到textfield。

整体页面代码：

    <?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">

    <xp:this.data>
        <xp:dominoDocument var="document1" formName="testing">
        </xp:dominoDocument>
    </xp:this.data>

    <xp:br></xp:br>
    <xp:repeat id="repeat1" rows="30" var="r" indexVar="i" first="0">
        <xp:this.value><![CDATA[#{javascript:var v:java.util.Vector = new java.util.Vector();
v.add('Date1');v.add('Date2');v.add('Date3');v.add('Date4');v.add('Date5');v.add('Date6');
return v;}]]></xp:this.value>
        <xp:br></xp:br>
        <xp:div id="checkDiv">



            <xp:checkBox id="checkBox1">

            <xp:this.styleClass><![CDATA[#{javascript:return ""+r;}]]></xp:this.styleClass>
            <xp:eventHandler event="onchange" submit="true"
                refreshMode="partial" refreshId="finalDate">
                <xp:this.action><![CDATA[#{javascript:if(getComponent("checkBox1").getValue() == "true"){
getComponent("finalDate").setValue(""+r);
}
else
getComponent("finalDate").setValue("");
}]]></xp:this.action>
                <xp:this.script><![CDATA[var v = document.getElementById('#{id:finalDate}').value;
if(v!="")
{
$("."+v).prop("checked", false);
}


]]></xp:this.script>
            </xp:eventHandler></xp:checkBox>
            <xp:text escape="true" id="computedField1"
                value="#{javascript:r}">

            </xp:text>
        </xp:div>
        <xp:br></xp:br>
    </xp:repeat>
    <xp:inputText id="finalDate"></xp:inputText>
</xp:view>

如果在重复控制中使用单选按钮，这也很有用。复选框现在可以根据需要使用，并将值设置为文本字段。

只允许在重复控制中选中一个复选框

3 个答案: