TitleBar tabs in ApplicationLayout control (extlib) generating invalid code

问题

I am using an ApplicationLayout control (8.5.3 UP1) and have added Basic Nodes to be displayed as tabs. I want the tabs to run JavaScript to set a sessionScope variable when clicked. I have a sessionScope.put in the onClick but the variable is not set properly when the tab is clicked.

Worse, when I look at the source of the page, this is what I see for the tabs:

<ul id="view:_id1:_id2:applicationLayout1_tb" class="lotusTabs lotusTabsIndented">

 <li class="lotusTabs li">
  <div>
   <a style="text-decoration:none">Ft. Pierce</a>
  </div>
 </li>

 <li class="lotusTabs li">
  <div>
   <a href="javascript:;" onclick="javascript:Ft. Pierce" style="text-decoration:none">Naperville</a>
  </div>
 </li>

 <li class="lotusTabs li">
  <div>
   <a href="javascript:;" onclick="javascript:Naperville" style="text-decoration:none">Chicago</a>
  </div>
 </li>
</ul>

Notice how the first li does not have an href or onclick code and the other two li entries have what appears to be incorrect href and onclick parameters (and that the onclick does not match the label).

From what I can see in the control, this should work. It should execute the onClick code if there is nothing in the href property for the node. I'd appreciate any thoughts or ideas on getting this working. Thanks.

回答1:

The onClick event on a basicTreeNode is used for running clientSide javascript. You won't be able to put any SSJS such as the sessionScope.put that you have described.

To do what you require you will need to use the submitValue property of the basicTreeNode and then add your script to set the sessionScope to the onItemClick event of the applicationLayout control.

<xe:applicationLayout id="applicationLayout1">
        <xe:this.configuration>
            <xe:oneuiApplication>
                <xe:this.titleBarTabs>
                    <xe:basicLeafNode label="Tab 1" submitValue="tab1" />
                    <xe:basicLeafNode label="Tab 2" submitValue="tab2" />
                    <xe:basicLeafNode label="Tab 3" submitValue="tab3" />
                </xe:this.titleBarTabs>
            </xe:oneuiApplication>
        </xe:this.configuration>
        <xp:eventHandler event="onItemClick" submit="true" refreshMode="complete">
            <xe:this.action><![CDATA[#{javascript:sessionScope.put("varName",context.getSubmittedValue())}]]></xe:this.action>
        </xp:eventHandler>
    </xe:applicationLayout>

来源：https://stackoverflow.com/questions/9293852/titlebar-tabs-in-applicationlayout-control-extlib-generating-invalid-code

标签

xpages