Question

我正在尝试对我的手风琴控件进行部分刷新（来自扩展库）。我尝试了两种方法但没有成功。

问题1：我试图将手风琴控件放在面板中并尝试刷新面板，但这会导致dojo错误：

“尝试使用id == view注册小部件：_id1：myaccordion但该ID已经注册”

问题2：我试图通过它的id直接刷新手风琴，但随后手风琴被打破了。我无法按照此链接（http://www.mydominolab.com/2010/07/dijitdialog-inside-partial-refreshing.html）推荐的方式销毁手风琴控制，因为它有许多其他问题，而且该链接专门处理与手风琴完全不同的对话控制。

你能告诉我什么吗？基本上这里的手风琴窗格显示了文档的数量，我想及时刷新以更新计数。任何帮助都会非常感激。

编辑1：只需添加示例代码以供参考（此代码将导致上述问题2，如果由面板包围并按面板ID刷新，则会出现问题1）：

<?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:button value="Refresh" id="button1">
        <xp:eventHandler event="onclick" submit="true"
            refreshMode="partial" refreshId="accordion1">
        </xp:eventHandler></xp:button>
    <xp:br></xp:br>
    <xp:br></xp:br>
    <xe:accordion id="accordion1">
        <xe:this.treeNodes>
            <xe:basicContainerNode label="Accordion 1">
                <xe:this.children>
                    <xe:basicLeafNode label="Category x"></xe:basicLeafNode>
                </xe:this.children>
</xe:basicContainerNode>
            <xe:basicContainerNode label="Accordion 2">
                <xe:this.children>
                    <xe:basicLeafNode label="Category y"></xe:basicLeafNode>
                </xe:this.children>
</xe:basicContainerNode>    

        </xe:this.treeNodes></xe:accordion>
</xp:view>

编辑2：上面的代码在添加面板时可以正常工作。没有测试就发布它是我的错误。但是，我发现实际问题是Dojo布局，我试图用于左侧导航。以下是打破手风琴的示例代码。

    <?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" 
    xmlns:xc="http://www.ibm.com/xsp/custom"
    pageTitle="S4EP TEAMGROUND"
    xmlns:xe="http://www.ibm.com/xsp/coreex">
    <xp:button value="Refresh" id="button1">
        <xp:eventHandler event="onclick" submit="true" refreshMode="partial" refreshId="myPanel">
        </xp:eventHandler></xp:button>
        <xp:div id="body" dojoType="dijit.layout.BorderContainer"
            style="height:100%;width:100%;align:center;">
            <xp:this.dojoAttributes>
                <xp:dojoAttribute name="persist" value="false"></xp:dojoAttribute>
                <xp:dojoAttribute name="gutters" value="false"></xp:dojoAttribute>
            </xp:this.dojoAttributes>
            <xp:div id="left" dojoType="dijit.layout.ContentPane"
                style="width:220px;height:50%">
                <xp:this.dojoAttributes>
                    <xp:dojoAttribute name="region" value="left"></xp:dojoAttribute>
                    <xp:dojoAttribute name="splitter" value="true"></xp:dojoAttribute>
                </xp:this.dojoAttributes>
                    <xp:panel id="myPanel">
<xe:accordion id="accordion1">
        <xe:this.treeNodes>
            <xe:basicContainerNode label="Accordion 1">
                <xe:this.children>
                    <xe:basicLeafNode label="Category x"></xe:basicLeafNode>
                </xe:this.children></xe:basicContainerNode>
            <xe:basicContainerNode label="Accordion 2">
                <xe:this.children>
                    <xe:basicLeafNode label="Category y"></xe:basicLeafNode>
                </xe:this.children></xe:basicContainerNode> 

        </xe:this.treeNodes></xe:accordion>
</xp:panel>

            </xp:div>
        </xp:div>
</xp:view>

Answer 1

问题是，当你部分刷新你的手风琴小部件时，dojo不会再创建你的小部件。您可以通过在脚本块中创建窗口小部件来解决这个问题。因此，如果使用脚本块刷新面板，它将再次执行并重新创建窗口小部件：

<xp:div id="body"   dojoType="dijit.layout.BorderContainer" style="height:100%;width:100%;align:center;">
        <xp:this.dojoAttributes>
            <xp:dojoAttribute name="persist" value="false"></xp:dojoAttribute>
            <xp:dojoAttribute name="gutters" value="false"></xp:dojoAttribute>
        </xp:this.dojoAttributes>
        <xp:div id="left"   dojoType="dijit.layout.ContentPane" style="width:220px;height:50%">
            <xp:this.dojoAttributes>
                <xp:dojoAttribute name="region" value="left"></xp:dojoAttribute>
                <xp:dojoAttribute name="splitter" value="true"></xp:dojoAttribute>
            </xp:this.dojoAttributes>
            <xp:panel id="myPanel">
                <xp:panel id="leftAccordion">
                    <xp:scriptBlock type="text/javascript">
                        <xp:this.value><![CDATA[
                            dojo.require("dijit.layout.AccordionContainer");
                            dojo.require("dijit.layout.ContentPane");

                            XSP.addOnLoad(function() {
                                var aContainer = new dijit.layout.AccordionContainer({
                                    style: "width:220px;height:50%"
                                },
                                "#{id:leftAccordion}");

                                aContainer.addChild(new dijit.layout.ContentPane({
                                    title: "This is a content pane"
                                },'#{id:container1}'));

                                aContainer.addChild(new dijit.layout.ContentPane({
                                    title: "This is as well"
                                },'#{id:container2}'));

                                aContainer.startup();
                            });]]></xp:this.value>
                    </xp:scriptBlock>
                    <xp:panel id="container1">
                        <xp:text escape="true" id="computedField1">
                            <xp:this.value><![CDATA[#{javascript:"Entry "+ @Now().toLocaleTimeString();}]]></xp:this.value>
                        </xp:text>
                    </xp:panel>
                    <xp:panel id="container2">
                        <xp:text escape="true"  id="computedField2">
                            <xp:this.value><![CDATA[#{javascript:"Entry "+ @Now().toLocaleTimeString();}]]></xp:this.value>
                        </xp:text>
                    </xp:panel>
                </xp:panel>
            </xp:panel>
        </xp:div>
    </xp:div>

您可以使用container1或container2向您的手风琴添加按钮，也可以按照link创建它们。这里的按钮带有部分刷新：

<xp:button
    value="Refresh"
    id="button1">
    <xp:eventHandler
        event="onclick"
        submit="true"
        refreshMode="partial"
        refreshId="myPanel">
    </xp:eventHandler>
</xp:button>

唯一的问题是，当您部分刷新区域时，accoridon会再次关闭，但此解决方案在Firefox和IE10中对我有效=）

XPages - 扩展库中的部分刷新手风琴控件

1 个答案: