/* For Demo */ /* add elements based on retrieved data */ function showStuff(page, data) { var data = data ? data : "noValue"; var $page = $(page); var demo = { fruits: ["Orange", "Apple"], vegetables: ["Tomato", "Carrot"], noValue: ["nothing"] }; var list = $("<ul/>", { "data-role": "listview", "data-inset": true, "data-theme": "b" }); var items = ''; $.each(demo[data], function (i, v) { items = $("<li>" + v + "</li>"); list.append(items); }); $("ul", $page).remove(); $(".ui-content", $page).append(list); $("ul", $page).listview(); } /* Pass data with changePage */ $(document).on("pageinit", "#p1", function () { $(".data").on("click", function () { $.mobile.pageContainer.pagecontainer("change", "#p2", { stuff: this.id, transition: "flip" }); }); }); /* retrieve data and run function to add elements */ $(document).on("pagebeforechange", function (e, data) { if ($.type(data.toPage) == "object" && data.toPage[0].id == "p2") { var stuff = data.options.stuff ? data.options.stuff : null; showStuff("#p2", stuff); } });