按钮只能在 XPage 上单击一次

Button can be clicked only once on a XPage

我有以下 XPage,它有一个 table 而只有两个 tr。

第一个是按钮本身,第一次点击时输入 viewScope['showPasswordTr'] 布尔值 true,再次点击时输入 false

如果 viewScope['showPasswordTr'] 为真,第二个 tr 有一个输入。

我遇到的问题是我只能点击按钮一次,而且是 100% 因为存在输入字段。如果我删除它,它会按预期工作

第二次以此类推,按钮只是冻结并且不执行指定的操作 onclick 事件。为什么会这样?我怎样才能让它按预期工作?

提前致谢。

编辑

嗯,明明都是因为 required 属性 设置为 true... 那么,我是不是应该只在disered控件中检查元素是否为空?这是一个好习惯吗?

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

<xp:table id="buttonTable">
    <xp:tr id="buttonTr">
        <xp:td id="buttonTd">
            <xp:button id="authAsPersonButton" 
                value="This button can be clicked only once" />
                <xp:eventHandler event="onclick" submit="true"
                    refreshMode="partial" execId="buttonTable"
                    refreshId="buttonTable">
                    <xp:this.action>
                        <![CDATA[#{javascript:
                        print("clicked");
                        if(viewScope['showPasswordTr']) 
                        {
                            viewScope['showPasswordTr'] = false;
                        }
                        else 
                        {
                            viewScope['showPasswordTr'] = true;
                        }

                        }]]>
                    </xp:this.action>
                </xp:eventHandler>
        </xp:td>
    </xp:tr>

    <xp:tr id="passwordLabelTr" rendered="#{javascript:
                return  viewScope['showPasswordTr'] == true;
                }">

            <xp:td id="passwordLabelTd">
                <xp:text id="passwordText" style="font-size: 14px;">
                    <xp:this.value>
                        <![CDATA[#{javascript: 
                            return 'password:';
                            }]]>
                    </xp:this.value>
                </xp:text>
            </xp:td>


        <xp:td id="passwordInputTd" align="right">
            <xp:inputText id="passwordInput" password="true"
                required="true">
            </xp:inputText>
        </xp:td>

    </xp:tr>

</xp:table>

</xp:view>

execId="buttonTd"disableValidators="true" 添加到您的事件处理程序属性。那么您的示例将按预期工作。

我稍微优化了代码(按钮内的事件处理 + 更短的处理代码 viewScope.showPasswordTr):

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

    <xp:table id="buttonTable">

        <xp:tr id="buttonTr">
            <xp:td id="buttonTd">
                <xp:button id="authAsPersonButton" value="Toggle password field">
                    <xp:eventHandler event="onclick" submit="true"
                        refreshMode="partial" refreshId="buttonTable" execMode="partial"
                        disableValidators="true">
                        <xp:this.action>
                        <![CDATA[#{javascript:
                            viewScope.showPasswordTr = !viewScope.showPasswordTr}]]>
                        </xp:this.action>
                    </xp:eventHandler>
                </xp:button>
            </xp:td>
        </xp:tr>

        <xp:tr id="passwordLabelTr" rendered="#{!!viewScope.showPasswordTr}">
            <xp:td id="passwordLabelTd">
                <xp:text id="passwordText" style="font-size: 14px;" value="password:" />
            </xp:td>
            <xp:td id="passwordInputTd" align="right">
                <xp:inputText id="passwordInput" password="true"
                    required="true">
                </xp:inputText>
            </xp:td>
        </xp:tr>

    </xp:table>

</xp:view>