свойство keepState элемента управления ExtLib Navigator не работает - PullRequest
Новая
       19

свойство keepState элемента управления ExtLib Navigator не работает

1 голос
/ 18 марта 2020

Я тестирую элемент управления Navigator в библиотеке расширений внутри элемента управления макета приложения. Nav на главном XPage имеет два контейнерных узла, каждый из которых содержит два узла страницы. Каждый узел страницы ведет к простому XPage с одной кнопкой «Return» с простым действием для загрузки главной страницы. 

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">

    <xe:applicationLayout id="applicationLayout1">

        <xe:this.configuration>
            <xe:bootstrapResponsiveConfiguration
                pageWidth="fluid" fixedNavbar="fixed-top" collapseLeftColumn="true" legal="false"
                placeBar="false" titleBar="false" footer="false">
                <xe:this.bannerApplicationLinks>
                    <xe:pageTreeNode label="Page 1" />
                    <xe:pageTreeNode label="Page 2" />
                </xe:this.bannerApplicationLinks>
            </xe:bootstrapResponsiveConfiguration>
        </xe:this.configuration>

        <xp:this.facets>
            <xp:div xp:key="LeftColumn">
                <xe:navigator id="navigator1" keepState="true" expandable="true">
                    <xe:this.treeNodes>
                        <xe:basicContainerNode label="Container 1">
                            <xe:this.children>
                                <xe:pageTreeNode label="a1" page="/a1.xsp" />
                                <xe:pageTreeNode label="a2" page="/a2.xsp" />
                            </xe:this.children>
                        </xe:basicContainerNode>
                        <xe:basicContainerNode label="Container 2">
                            <xe:this.children>
                                <xe:pageTreeNode label="a1" page="/a1.xsp" />
                                <xe:pageTreeNode label="a2" page="/a2.xsp" />
                            </xe:this.children>
                        </xe:basicContainerNode>
                    </xe:this.treeNodes>
                </xe:navigator>
            </xp:div>
        </xp:this.facets>
    </xe:applicationLayout>
</xp:view>

Свойство keepState устанавливается в true, но если я сверну один из контейнеров и go на другой странице, контейнер открывается и не сохраняет свое состояние, когда я возвращаюсь. Это происходит независимо от того, использую ли я кнопку «Назад» в браузере или кнопку «Возврат» на дополнительной странице.

Я неправильно интерпретирую свойство keepState или оно повреждено? Я провел поиск в Google и OpenNTF и не нашел ничего об этой проблеме.

1 Ответ

1 голос
/ 23 марта 2020

Я просмотрел код на Github в соответствии с предложением Пера, и это действительно предполагаемая функциональность:

Определяет, следует ли сохранять свернутые или развернутые состояния элементов между запросами к серверу

Так как он кажется неисправным, я нашел обходной путь, используя событие навигатора onItemClick для сохранения состояния в переменной sessionScope.navState. Я сохраняю состояние каждого контейнера как запись в хэш-карте в одной переменной sessionScope, чтобы избежать нескольких переменных для нескольких контейнеров. Свойство expanded каждого контейнера затем загружается из sessionScope.navState.[container name].

Однако у него есть два недостатка:

  1. При возврате на страницу навигатора состояние восстанавливается только тогда, когда страница напрямую перезагружается / обновляется. Состояние НЕ восстанавливается при использовании кнопки «Назад» в браузере.
  2. Очевидно, что поворот - это отдельная ссылка из текста контейнера. Состояние сохраняется при нажатии на текст, но не на поворот, и доступ к повороту не отображается в свойствах элемента управления.

Обновленный код ниже, слегка отредактированный для краткости. Идеи для недостатков приветствуются. 

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">

    <xp:this.beforePageLoad><![CDATA[#{javascript:
//initialize navigator state
if (sessionScope.navState == null) {
    sessionScope.navState = new java.util.HashMap();
    sessionScope.navState.put("c1", false);
    sessionScope.navState.put("c2", false);
}}]]></xp:this.beforePageLoad>

    <xe:applicationLayout id="applicationLayout1">

        <xe:this.configuration>
           [...]
        </xe:this.configuration>

        <xp:this.facets>
            <xp:div xp:key="LeftColumn">
                <xe:navigator id="navigator1" keepState="true" expandable="true">

                    <xp:eventHandler event="onItemClick" submit="true"
                        refreshMode="partial" refreshId="navigator1">
                        <xe:this.action><![CDATA[#{javascript:
var entry = context.getSubmittedValue();
sessionScope.navState.put(entry, !sessionScope.navState.get(entry));
}]]></xe:this.action>
                    </xp:eventHandler>

                    <xe:this.treeNodes>
                        <xe:basicContainerNode label="Container 1"
                            submitValue="c1" expanded="#{javascript:sessionScope.navState.c1}">
                            <xe:this.children>
                                <xe:pageTreeNode label="hello" page="/a1.xsp" />
                                <xe:pageTreeNode label="goodbye" page="/a2.xsp" />
                            </xe:this.children>
                        </xe:basicContainerNode>
                        <xe:basicContainerNode label="Container 2"
                            submitValue="c2" expanded="#{javascript:sessionScope.navState.c2}">
                            <xe:this.children>
                                <xe:pageTreeNode label="hello" page="/a1.xsp" />
                                <xe:pageTreeNode label="goodbye" page="/a2.xsp" />
                            </xe:this.children>
                        </xe:basicContainerNode>
                    </xe:this.treeNodes>
                </xe:navigator>
            </xp:div>
        </xp:this.facets>
    </xe:applicationLayout>
</xp:view>
...