Xpages:ExtLib V12:带有Bootstrap配置的应用程序布局.可折叠的左列

Rei*_*ner 2 collapse xpages twitter-bootstrap xpages-extlib

我正在使用带有bootstrapResponsiveConfiguration的Application Layout Control.nsf在9.0.1FP2服务器上运行,我使用的是最新的Extension Library版本v12.源代码如下:

...
<xe:applicationLayout id="applicationLayout1">
        <xp:callback
            facetName="facetMiddle"
            id="facetMiddle">
        </xp:callback>
        <xe:this.facets>
            <xp:callback
                facetName="facetLeft"
                id="facetLeft"
                xp:key="LeftColumn">
            </xp:callback>
            <xp:callback
                facetName="facetRight"
                id="facetRight"
                xp:key="RightColumn">
            </xp:callback>
        </xe:this.facets>
        <xe:this.configuration>
            <xe:bootstrapResponsiveConfiguration invertedNavbar="true"
                collapseLeftColumn="true" productLogoAlt="SelfService"
                placeBar="false" footer="false" legal="false" pageWidth="fluid"
                fixedNavbar="fixed-top">
...
Run Code Online (Sandbox Code Playgroud)

结果是:如果我在桌面上调整窗口大小或在移动设备上查看页面,则会隐藏左列(如预期的那样).

但不幸的是,我无法获得访问左列的句柄.我期待一个菜单按钮,或类似的东西.

有谁知道我做错了什么?提前致谢

Mar*_*ink 5

只有在应用程序布局的左栏中有一个菜单(在生成的HTML中)包含使用<ul>标记的菜单选项列表(在Bootstrap布局中很常见)时,"可折叠左菜单"功能才有效.我只是在左栏中尝试了这个:

<ul>
  <li>Menu option 1</li>
  <li>Menu option 2</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

并且它有效:它在我的布局中自动创建了一个带有默认标签'Menu'的按钮(可以使用collapseLeftMenuLabel属性进行更改).该按钮仅在小屏幕上可见,并打开一个弹出菜单,显示您创建的菜单选项.

您可以通过在XPage中编写HTML或通过向<xe:navigator>左列添加控件来创建菜单:这也将<ul><li>在生成的HTML中创建结构.

在此输入图像描述