Reputation: 616
I'm trying to write the declarative example in a programmatic way, but so far no success. 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 file: #borderContainer { width: 100%; height: 100%; }
You can see the code here: http://jsbin.com/inulig/27/edit#source
Thanks!
Upvotes: 1
Views: 4028
Reputation: 945
borderContainer.addChild(contentPane);
borderContainer.startup(); //DO NOT FORGET TO STARTUP!!!
Upvotes: 1
Reputation: 616
I found http://blog.garethj.com/2010/08/programmatic-page-layouts-using-dojo-and-existing-markup/ which gave me a lead to the issue.
I had to use borderContainer.addChild(contentPane)
and not contentPane.placeAt(borderContainer, "last")
I'll leave the answer here in case other might get stumbled upon this too.
Upvotes: 5