CODEWITHSUNDEEP
xpagesxpages-extlib
Ben Dubuc
Ben Dubuc

Reputation: 523

Configurable XPages ApplicationLayout titlebar tabs: so close, but

I am now getting my tabs in the Application Layout's TitleBar form a view, but it seems that managing the "selected" property is not wotking. Here is the code I have in my page:

<xe:this.titleBarTabs>
                <xe:repeatTreeNode indexVar="1" var="tab">
                    <xe:this.children>
                        <xe:basicLeafNode label="#    {tab.label}"
                            submitValue="#{tab.label}"
                            onClick="#{javascript:sessionScope.selectedTab = tab.label;}">
                            <xe:this.href><![CDATA[#{javascript:
                               "home.xsp?action=openDocument&documentId=" + tab.unid;}]]>
                            </xe:this.href>
                            <xe:this.selected>
                                <![CDATA[#{javascript:tab.label==sessionScope.selectedTab;}]]>
                            </xe:this.selected>
                        </xe:basicLeafNode>
                    </xe:this.children>
                    <xe:this.value><![CDATA[#{javascript:getTabs();}]]></xe:this.value>
                </xe:repeatTreeNode>
            </xe:this.titleBarTabs>

Can this be that hte Href and onClick cannot be there at the same time or I'm just missing something?

As usual, thanks a million for your help. Can't wait to give some back...

Upvotes: 1

Views: 176

Answers (2)

Knut Herrmann
Knut Herrmann

Reputation: 30960

You have to decide what shall happen when user clicks a title bar tab:

  • open URL defined in href

OR

  • execute onClick event.

The help for onClick gives the hint:

enter image description here

So, you can't use onClick and a scope variable to appear a tab selected after user clicked on tab and new content shows up.

To accomplish this

  • add an URL parameter &tab= with the tab label tab.label to your href URL
  • return true in selected code if the current tab label is equal to the tab URL parameter

Your href and selected properties would look like this then:

<xe:this.href><![CDATA[#{javascript:
    "home.xsp?action=openDocument&documentId=" + tab.unid + "&tab=" + tab.label}]]>
</xe:this.href>
<xe:this.selected>
    <![CDATA[#{javascript:tab.label === param.tab}]]>
</xe:this.selected>

Don't forget to delete the onClick property in your code. You don't need it anymore.

Upvotes: 1

Peter Della-Nebbia
Peter Della-Nebbia

Reputation: 827

Along the lines of what Knut is suggesting (I think) ... comment out the onClick property for the basicLeafNode and moves its function to the onItemClick for the xe:applicationLayout control.

The code for the onItemClick would be something like this...

  var clickedTab = context.getSubmittedValue();
  sessionScope.selectedTab = clickedTab;

Upvotes: 0

Related Questions