Question

我在边框容器中有三个内容窗格，它们的区域指定为left，right和center.Now我想只保留左边和中心区域内容窗格默认显示但是当有些甚至出现时我想打开正确的内容窗格。以下是我尝试使用此功能，我可以将右侧区域隐藏为默认值，但在事件发生时不会显示。

div id="appLayout" data-dojo-attach-point="_borderContainer" data-dojo-type="idx/layout/BorderContainer" class="contentPane dbLayout-left"  data-dojo-props="design: 'headline'" >
<div id="leftCol" class="edgePanel" data-dojo-type="dijit/layout/ContentPane" style="width:23%" data-dojo-props="region: 'left',splitter: true">
Left Pane
</div>
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-attach-point="customitemPropArea" data-dojo-props="region: 'right', splitter: true, open:false" style="width:25%;">
Right Pane
</div>
<div class="centerPanel" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region: 'center', splitter: true">
Center Pane
</div>
</div>

活动的Javascript：

this.connect(this.searchResults,"onRowClick",function(){
this.customitemPropArea.set("open",true);
            var splitter = this.customitemPropArea._splitterWidget;
            console.log("splitter: "+splitter);
            domStyle.set(splitter.domNode, "display", "");
}

Answer 1

只需使用addchild的{{1}} / removeChild方法：

BorderContainer

require([
    "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/dom", "dojo/on",
    "dojo/domReady!"
], function(BorderContainer, ContentPane, dom, on){
    // create a BorderContainer as the top widget in the hierarchy
    var bc = new BorderContainer({
        style: "height: 300px; width: 500px;"
    });

    // create a ContentPane as the left pane in the BorderContainer
    var cp1 = new ContentPane({
        region: "left",
        style: "width: 100px",
        content: "Left"
    });
    bc.addChild(cp1);

    // create a ContentPane as the center pane in the BorderContainer
    var cp2 = new ContentPane({
        region: "center",
        content: "Center"
    });
    bc.addChild(cp2);
  
    // create a ContentPane as the right pane in the BorderContainer
    // but we don't add it to the borderContainer
    var cp3 = new ContentPane({
        region: "right",
        style: "width: 100px",
        content: "Right"
    });
  

    // put the top level widget into the document, and then call startup()
    bc.placeAt(document.body);
    bc.startup();
 
    on(dom.byId("toggleLink"), "click", function() {
      if(bc.getIndexOfChild(cp3) >= 0) {
         //right panel is there, we remove it  
         bc.removeChild(cp3);
      } else {
         //right panel should be added
         bc.addChild(cp3);
      }
     
    });
});

当某些事件发生时，在bordercontainer中显示尾随区域

1 个答案: