【问题标题】:dojo/dijit BorderContainer declarative example - but programmaticdojo/dijit BorderContainer 声明性示例 - 但程序化
【发布时间】:2011-07-20 10:14:31
【问题描述】:

我正在尝试以编程方式编写声明性示例,但到目前为止还没有成功。 http://dojotoolkit.org/reference-guide/dijit/layout/BorderContainer.html

dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.layout.BorderContainer");

dojo.addOnLoad(function() {

    var borderContainer = new dijit.layout.BorderContainer({
        design: "sidebar",
        gutters: true,
        liveSplitters: true,
        id: "borderContainer"
    });

   borderContainer.placeAt(dojo.body(), "last");

    var panelLeft = new dijit.layout.ContentPane({
        content: "<p>left</p>",
        splitter: true,
        region: "leading",
        style: "width: 300px;"
    });
    panelLeft.placeAt("borderContainer", "first");

    var panelRight = new dijit.layout.ContentPane({
        content: "<p>right</p>",
        splitter: true,
        region: "center"
    });
    panelRight.placeAt("borderContainer", "last");

});

CSS 文件:#borderContainer { width: 100%; height: 100%; }

您可以在此处查看代码:http://jsbin.com/inulig/27/edit#source

谢谢!

【问题讨论】:

  • 好的,这让我很开心,但这种情况经常发生。在我问到某个地方之后,我通常也会找到答案。我确实尝试过自己做,我做了几个小时。我找到了blog.garethj.com/2010/08/…,这让我找到了这个问题的线索。我必须使用borderContainer.addChild(contentPane) 而不是contentPane.placeAt(...)。我会在这里留下答案,以防其他人也可能偶然发现这个问题。 [[我无法发布自己的答案]]
  • 当然,您可以发布自己的答案。其他人也可以发布更多答案,最好的答案有望被投票。
  • 是的,自发布问题以来我不得不等待 8 小时。

标签: javascript dojo dijit.layout


【解决方案1】:

我找到了http://blog.garethj.com/2010/08/programmatic-page-layouts-using-dojo-and-existing-markup/,这让我找到了问题的线索。

我必须使用borderContainer.addChild(contentPane) 而不是contentPane.placeAt(borderContainer, "last")

我会在此处留下答案,以防其他人也可能偶然发现此问题。

【讨论】:

    【解决方案2】:
    borderContainer.addChild(contentPane);
    borderContainer.startup(); //DO NOT FORGET TO STARTUP!!!
    

    【讨论】:

      【解决方案3】:

      这样做:contentPane.placeAt(borderContainer.domNode, "last");

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2023-03-23
        • 1970-01-01
        • 2010-12-16
        • 1970-01-01
        • 2011-11-18
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多