Onclick event in Outline gets executed on page open

Question

I have an extension library outline control. I have two basicLeafNodes in the outline. The onclick event on each of these nodes is supposed to run some code. The problem is both of those onClick events are being executed when the page is open but does not seem to execute when you actually click on the node.

Any idea what could be wrong?

<xe:outline id="outline1">

<xe:this.treeNodes>
        <xe:basicLeafNode label="Set Value 1">
            <xe:this.onClick><![CDATA[#{javascript:getComponent("inputText1").value = "123";}]]></xe:this.onClick>
        </xe:basicLeafNode>
        <xe:basicLeafNode label="Set Value2">
            <xe:this.onClick><![CDATA[#{javascript:getComponent("inputText2").value = "456";}]]></xe:this.onClick>
        </xe:basicLeafNode>
    </xe:this.treeNodes>

</xe:outline>
<xp:br></xp:br>
<xp:br></xp:br>
<xp:br></xp:br>Value 1:&#160;
<xp:inputText id="inputText1"></xp:inputText>
<xp:br></xp:br>Value 2:&#160;
<xp:inputText id="inputText2"></xp:inputText>

Per Henrik Lausten Per Henrik Lausten · Accepted Answer · 2013-02-07T20:42:20

The onClick event of the basicLeafNode is for client-side JS only. You need to use the submitValue property of each basicLeafNode to and then add SSJS to the onItemClick event of the outline control. You can then use context.getSubmittedValue() to check what node was clicked and then act accordingly:

<xe:outline id="outline1">
    <xe:this.treeNodes>
        <xe:basicLeafNode label="Set Value 1" submitValue="1"></xe:basicLeafNode>
        <xe:basicLeafNode label="Set Value2" submitValue="2"></xe:basicLeafNode>
    </xe:this.treeNodes>
    <xe:this.onItemClick><![CDATA[#{javascript:
        if (context.getSubmittedValue() == "1") {
            getComponent("inputText1").value = "123"
        } else if (context.getSubmittedValue() == "1") {
            getComponent("inputText2").value = "456"
        }
    }]]></xe:this.onItemClick>
</xe:outline>

From the XPages Extension Library book (page 240):

The onClick property allows the developer to execute a piece of Client-Side JavaScript code, and the submit- Value property allows the developer to specify a value that is passed back to the server. This value is accessed from the onItemClick event of the control that contains the tree nodes.

Onclick event in Outline gets executed on page open

1 Answers