Question

我将所有组件绑定到java源代码。一个字段是单选按钮，如果用户选择＆＃34;其他＆＃34;作为一个值，那么我必须显示一个标有＆＃34; Other＆＃34;供用户填写。

我不能使用SJSS来获取单选按钮的值，因为它还不存在。但那我怎么知道用户选择了什么？在更改事件中，我应该设置viewScope var并刷新辅助区域并检查viewScope var的值吗？

<xc:cc_CommonFormField
                                    id="cc_CommonFormField14"
                                    label="Savings and/or Revenue From the Project"
                                    placeholder="">
                                    <xp:this.facets>
                                        <xp:radioGroup
                                            xp:key="field"
                                            id="radioGroup1"
                                            value="#{doc.prjSav}">
                                            <xp:selectItem
                                                itemLabel="Financial"
                                                itemValue="Financial">
                                            </xp:selectItem>
                                            <xp:eventHandler
                                                event="onclick"
                                                submit="true"
                                                refreshMode="norefresh">
                                                <xp:this.script><![CDATA[var result=null;

for(var i=0; i<document.forms[0].elements.length; i++){
    if(document.forms[0].elements[i].name=="#{id:radioGroup1}" ){

        if(document.forms[0].elements[i].checked == true){
            result=document.forms[0].elements[i].value;
            break; //remove this if for check box groups and collect multiple values above instead
}}}

var sel = x$("#{id:innerRefresh}");

if (result == "Other")
{
x$("#{id:innerRefresh}").removeClass("scoHidden");
x$("#{id:innerRefresh}").addClass("scoVisible");
}
else
{
x$("#{id:innerRefresh}").removeClass("scoVisible")
x$("#{id:innerRefresh}").addClass("scoHidden");
}

XSP.partialRefreshGet("#{id:innerRefresh}")]]></xp:this.script>
                                        </xp:eventHandler></xp:radioGroup>
                                    </xp:this.facets>
                                </xc:cc_CommonFormField>
                                <div id="refresh1">
                                    <xp:div id="innerRefresh" styleClass="scoHidden">
                                        <xc:cc_CommonFormField placeholder="Enter Other Reason...">
                                            <xp:this.facets>
                                                <xp:inputText
                                                    id="inputText3"
                                                    xp:key="field"
                                                    value="#{doc.prjOther}">
                                                </xp:inputText>
                                            </xp:this.facets>
                                        </xc:cc_CommonFormField>

以下是正确的代码：

Expression

Answer 1

有两种方法可以解决这个问题： - 使用SSJS进行服务器端渲染 - 使用JS

进行客户端渲染

当您选择前者时，您必须提交您的数据（部分包括隐藏的div）以重新计算您的渲染属性。

客户端：在任何情况下都渲染div，但是给它一个映射到CSS display：none的class属性。在客户端JS中，向单选按钮添加onChange处理程序，并将类更改为可见的（如果未选中其他类，则返回）。这使您免于服务器往返。

只有警告:(最好在Java中处理）如果未选择其他，则需要在字段中忽略最终输入的值。

Xpages：根据单选按钮值隐藏/显示div

1 个答案: