Question

我已将以下代码添加到新的XPage中，并且工作正常：

<xp:panel styleClass="DemoLeft" rendered="true">
    <xp:table styleClass="DemoLeft">
        <xp:tr>
            <xp:td>
                <xp:label value="First Name:" id="label1"></xp:label>
            </xp:td>
            <xp:td>
                <xp:inputText id="FirstNameXY"></xp:inputText>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
                <xp:label value="Last Name:" id="label2"></xp:label>
            </xp:td>
            <xp:td>
                <xp:inputText id="LastNameXY"></xp:inputText>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
                <xp:label value="Full Name:" id="label3"></xp:label>
                <xp:span id="F"></xp:span>
            </xp:td>
            <xp:td>
                <xp:inputText id="FullNameXY" readonly="true">
                </xp:inputText>
            </xp:td>
        </xp:tr>
    </xp:table>
</xp:panel>

<xp:panel styleClass="DemoLeft" rendered="true">
    <xp:table styleClass="DemoLeft">
        <xp:tr>
            <xp:td>
                <xp:button id="button3" value="Set Full Name">
                    <xp:eventHandler event="onclick" submit="true"
                        refreshMode="partial" refreshId="FullNameXY">
<xp:this.action><![CDATA[#{javascript:var fName = getComponent("FirstNameXY").getValue();
var lName = getComponent("LastNameXY").getValue();
var fullName = fName+" "+lName;
getComponent("FullNameXY").setValue(fullName);}]]></xp:this.action>
                    </xp:eventHandler>
                </xp:button>
            </xp:td>
        </xp:tr>
    </xp:table>
</xp:panel>

然而，当我将代码添加到现有XPage时，它根本不起作用 - 我点击按钮但没有任何反应。这可能是什么问题？

Answer 1

这里是一个如何更改代码的示例：Tim已经提到最重要的部分从不使用getComponent("id").getValue()将组件绑定到数据源或范围变量。

此外，我不会使用<xp:input>字段来显示值，使用<xp:text>元素并将代码移动到它，只要您只想显示计算值。

<xp:panel styleClass="DemoLeft" id="Demo">
    <xp:table styleClass="DemoLeft">
        <xp:tr>
            <xp:td>
                <xp:label value="First Name:" id="label1"></xp:label>
            </xp:td>
            <xp:td>
                <xp:inputText
                    id="FirstNameXY"
                    value="#{viewScope.firstName}"
                    defaultValue="">
                </xp:inputText>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
                <xp:label value="Last Name:" id="label2"></xp:label>
            </xp:td>
            <xp:td>
                <xp:inputText
                    id="LastNameXY"
                    value="#{viewScope.lastName}"
                    defaultValue="">
                </xp:inputText>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
                <xp:label value="Full Name:" id="label3"></xp:label>
                <xp:span id="F"></xp:span>
            </xp:td>
            <xp:td>
                <xp:text id="FullNameXY">
                    <xp:this.value><![CDATA[#{javascript://
                    var ret = [];
                    if(viewScope.firstName)
                        ret.push(viewScope.firstName)
                    if(viewScope.lastName)
                        ret.push(viewScope.lastName)                    
                    return ret.join(" ");}]]></xp:this.value>
                </xp:text>
            </xp:td>
        </xp:tr>
    </xp:table>
</xp:panel>

<xp:panel styleClass="DemoLeft" rendered="true">
    <xp:table styleClass="DemoLeft">
        <xp:tr>
            <xp:td>
                <xp:button id="button3" value="Set Full Name">
                    <xp:eventHandler
                        event="onclick"
                        submit="true"
                        refreshMode="partial"
                        refreshId="FullNameXY">
                        <xp:this.action><![CDATA[#{javascript://}]]></xp:this.action>
                    </xp:eventHandler>
                </xp:button>
            </xp:td>
        </xp:tr>
    </xp:table>
</xp:panel>

XPages - 使用getComponent（“ABC”）进行部分刷新.setValue（“XYZ”）

1 个答案: