将SSJS动作添加到bootstrap药丸中

Question

我添加了一个简单的药丸列表作为导航器:

<div class="container-fluid">
        <ul class="nav nav-pills">
            <li role="presentation" class="active">
                <a href="#">Profiles</a>
            </li>
            <li role="presentation">
                <a href="#">Applications</a>
            </li>
            <li role="presentation">
                <a href="#">Automation</a>
            </li>
        </ul>
    </div><!-- COntainer -->

如果我想要做的就是添加href链接,它工作得很好,但是当点击药丸时我需要运行一些SSJS.刚刚启动BootStrap山,所以这可能是不可行的.我已经搜索过,但一直无法找到如何做到这一点.任何帮助赞赏.

谢谢

Answer 1

<xp:link>而是使用HTML <a>.它允许您使用SSJS代码添加on click事件:

<div class="container-fluid">
    <ul class="nav nav-pills">
        <li role="presentation" class="active">
            <xp:link
                escape="true"
                text="Profiles"
                id="link1">
                <xp:eventHandler
                    event="onclick"
                    submit="true"
                    refreshMode="complete">
                    <xp:this.action><![CDATA[#{javascript:print("your SSJS code")}]]></xp:this.action>
                </xp:eventHandler>
            </xp:link>
        </li>
        <li role="presentation">
            <xp:link
            ...

<xp:link><a>最终被渲染成一个标签

<a id="view:_id1:link1" href="#" class="xspLink">Profiles</a>

您在评论中询问如何添加data-toggle="tab"到渲染<a ...>.你可以<xp:this.attrs>在内部完成<xp:link>:

        ...
            <xp:link
                escape="true"
                text="Profiles"
                id="link1">
                <xp:this.attrs>
                    <xp:attr
                        name="data-toggle"
                        value="tab">
                    </xp:attr>
                </xp:this.attrs>
                <xp:eventHandler
                    event="onclick"
        ...

渲染的链接就像这样

<a id="view:_id1:link1" href="#" class="xspLink" data-toggle="tab">Profiles</a>