Search code examples
javascriptdojo

inserting dijit content pane in dijit layout TitlePane programmatically

enter image description hereI'm trying to add a dijit/layout/ content pane to a dijit/title pane programmatically. The problem I'm having is that I cant get the content pane to go inside the title pane, it gets placed below it. My code is this: any ideas what I'm doing wrong?

Thanks

Pete

[![require(\[
            "dijit/TitlePane",
            "dijit/layout/ContentPane",
            "dojo/dom",
            "dojo/domReady!"
        \], function (TitlePane, ContentPane, dom) {

            //create the title pane to hold the layer list
            var tp = new TitlePane({ title: "Layers", id: "tp" });
            dom.byId("viewDiv").appendChild(tp.domNode);
            tp.startup();

            var cp = new ContentPane({ id: "cp", content: "Test" });
            cp.placeAt("tp");
            cp.startup();
            dom.byId("tp").appendChild(cp.domNode);

        });][1]][1]
Solution

  • TitlePane as a property content, you need to use that to set the contentpane

    ex 1: 

    var titlePane = new dijit.TitlePane({
        title:"This",    
        open: false,
        content: new ContentPane({
            content:"Hello, I'm content pane inside a title pane",
            style:"background:red"
        })
    });

    ex 2: 

    var cp = new ContentPnae({
           content:"Hello again, I'm CP within titlepane",
            style:"background:yellow"
});
    var titlePane = new dijit.TitlePane({
            title:"This too",    
            open: false           
        });
titlePane .set('content',cp.domNode);