• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 417
  • Last Modified:

Creating dojo mobile Views in code...this almost works...

I am building a mobile app using dojo and want to create my views in code (see snipit below).  My problem is that the views are all merging together instead of displaying separately.

Can anyone please guide me as to what I am missing.  I've tried to manually set one view as "hidden" but that seems to have to effect.  I am using IE 9.
//create main View

        var mainview = new dojox.mobile.View({ id: "mainview", selected: true }, dojo.body());

        var heading = new dojox.mobile.Heading({ label: "MarketWare" }).placeAt(mainview);
        var mainlist = new dojox.mobile.RoundRectList().placeAt(mainview);
        var listitem1 = new dojox.mobile.ListItem({ label: "Database", icon: "/Images/Database32.png", moveTo: "database" }).placeAt(mainlist);
        var listitem2 = new dojox.mobile.ListItem({ label: "List", icon: "/Images/List32.png", moveTo: "lists" }).placeAt(mainlist);
        var listitem3 = new dojox.mobile.ListItem({ label: "History", icon: "/Images/History32.png", moveTo: "history" }).placeAt(mainlist);

        //create database view
        var database = new dojox.mobile.View({ id: "database", selected: false }, dojo.body());

        var heading2 = new dojox.mobile.Heading({ label: "Database",back:"Main",moveTo:"mainview" }).placeAt(database);
        var mainlist2 = new dojox.mobile.RoundRectList().placeAt(database);
        var listitem21 = new dojox.mobile.ListItem({ label: "Company", moveTo: "company" }).placeAt(mainlist2);
        var listitem22 = new dojox.mobile.ListItem({ label: "Contact", moveTo: "contact" }).placeAt(mainlist2);
        var listitem23 = new dojox.mobile.ListItem({ label: "Issues",  moveTo: "issues" }).placeAt(mainlist2);

        mainview.startup();
        database.domNode.style.visibility = "hidden";

Open in new window

TwoViews.jpg
0
marketware
Asked:
marketware
1 Solution
 
leakim971PluritechnicianCommented:
replace : var mainview = new dojox.mobile.View({ id: "mainview", selected: true }, dojo.body());
by : var mainview = new dojox.mobile.View({ id: "mainview", selected: true };

and add :
dojo.body().appendChild(mainview.domNode);
just before :
mainview.startup();

do the same thing for all view (database)

test page : http://jsfiddle.net/kXHGj/
0
 
marketwareAuthor Commented:
Perfect!!!!!!!!!! Thank you.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now