Question

我在下面有一个导航药例子，我有一个导航药丸和活动标签切换取决于所选的标签，这工作正常。但是，该链接将浏览器发送到另一个页面。我想将活性药丸设置为与它离开时相同的药丸。我设置了sessionScope.ssSelectedPill =选择的链接ID，这样当我返回时，我知道在我离开之前活跃的药丸。

我不知道如何在回来的路上设置活性药丸。任何帮助表示赞赏，希望能够使用SSJS或CSJS而不是jQuery。

以下是源代码：

<xp:panel id="panelPills">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-10 col-sm-4">
                <ul class="nav nav-pills">

                    <li role="presentation" class="active">

                        <xp:link id="myActions" text="My Actions">
                            <xp:this.attrs>
                                <xp:attr name="data-toggle" value="tab">
                                </xp:attr>
                            </xp:this.attrs>
                            <xp:eventHandler event="onclick"
                                submit="true" refreshMode="partial"
                                refreshId="dynamicContentMainView">
                                <xp:this.action><![CDATA[#{javascript:sessionScope.ssSelectedPill = "myActions"
}]]></xp:this.action>
                            </xp:eventHandler>
                        </xp:link>
                    </li>
                    <li role="presentation">
                        <xp:link id="requests" text="Requests">
                            <xp:this.attrs>
                                <xp:attr name="data-toggle" value="tab">
                                </xp:attr>
                            </xp:this.attrs>
                            <xp:eventHandler event="onclick"
                                submit="true" refreshMode="partial"
                                refreshId="dynamicContentMainView">
                                <xp:this.action><![CDATA[#{javascript:sessionScope.ssSelectedPill = "requests";
}]]></xp:this.action>
                            </xp:eventHandler>
                        </xp:link>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</xp:panel>

Answer 1

将此“onClientLoad”事件处理程序添加到XPage

   <xp:eventHandler
      event="onClientLoad"
      submit="false">
      <xp:this.script><![CDATA[
         var selectedPillId = "#{javascript:getClientId(sessionScope.ssSelectedPill ? sessionScope.ssSelectedPill : 'myActions')}"
         document.getElementById(selectedPillId).parentNode.className = "active"]]></xp:this.script>
   </xp:eventHandler>

并从XPage中的class="active"标记中删除<li>。

此代码会在加载Xpage时将class="active"添加到上次选择的标签页如果第一次打开XPage（未设置sessionScope.ssSelectedPill），则“myActions”将被设置为活动状态。

这样，在重新加载XPage后，最后选择的选项卡处于活动状态。

返回页面时设置活动导航丸

1 个答案: