CODEWITHSUNDEEP
dojodojox.mobile
ksrini
ksrini

Reputation: 1642

Programmatically add child to dojox/mobile/ScrollablePane

How do I programmatically add a child to dojox/mobile/ScrollablePane? The reference guide only has a declarative example - http://dojotoolkit.org/reference-guide/1.10/dojox/mobile/ScrollablePane.html.

ScrollablePane Doesn't seem to have an addChild method. I tried using placeAt on the child widget and passed in the containerNode of the ScrollablePane. That doesn't work either.

The following declarative code works. I'm not able to do it programmatically. Specifically, I cant figure out how to add RoundRectList under the ScrollablePane.

<div id="home" data-dojo-type="dojox.mobile.View" data-dojo-props='selected:true'>
    <div data-dojo-type="dojox.mobile.Heading" data-dojo-props='label:"Title", fixed:"top"'>
        <span data-dojo-type="dojox/mobile/ToolBarButton"
                data-dojo-props='icon:"mblDomButtonWhiteSearch"'></span>
        <span id="refreshButton" data-dojo-type="dojox/mobile/ToolBarButton"
                  data-dojo-props="label: 'Exit'"
                  style="float:right;"></span>
    </div>
    <div data-dojo-type="dojox.mobile.ScrollablePane" style="position: relative; overflow: hidden;" >
    <h2 data-dojo-type="dojox.mobile.RoundRectCategory">Menu</h2>
    <ul data-dojo-type="dojox.mobile.RoundRectList">
        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='label:"Item 1", moveTo:"#", transition:"slide", onClick:openScreen' />
        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='label:"Item 2", moveTo:"#", transition:"slide", onClick:openScreen' />
        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='label:"Item 3", moveTo:"#", transition:"slide", onClick:openScreen' />
        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='label:"Item 4", moveTo:"#", transition:"slide", onClick:openScreen' />
        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='label:"Item 5", moveTo:"#", transition:"slide", onClick:openScreen' />
        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='label:"Item 6", moveTo:"#", transition:"slide", onClick:openScreen' />
    </ul>
    </div>
</div>

Upvotes: 0

Views: 267

Answers (2)

Bourbia Brahim
Bourbia Brahim

Reputation: 14702

Yeah , seems dojox exp missed implementation of this last , so you can workaround this issue by using the place methode of dojo/dom-construct module , so after creating you element , just place it's domNode inside the scrollpane's containers node as below code . (here I just affect the id="scrollpane" to the ScrollablePane and get it's reference using dijit/registry module )

var rectList = new RoundRectList();
domConstruct.place(rectList.domNode,registry.byId("scrollpane").containerNode, 'last');

you can see a sample Fiddle here

Upvotes: 0

bajji
bajji

Reputation: 1291

can you try something like

this.ScrollablePane.domNode.appendChild(RoundRectList.domNode);

before this, you need to construct RoundRectList

Upvotes: 0

Related Questions