0

In my app I would like to re-use the panel so I call this function when opening index.html:

var add_panel=function() {
//add button
$('[data-role="header"]').append('<a href="#leftpanel" class="ui-btn ui-icon-bars ui-btn-icon-notext ui-corner-all ui-btn-left">Menu</a>');

//panel
$.get('panel.html').success(function(data) {
    $('div[data-role="page"]').append(data);
    $('#leftpanel').trigger('create');
    $('#leftpanel').panel();
});

//open panel
$('body').on('click', '.ui-icon-bars', function() {
    $("#leftpanel").panel("toggle");
});
}

This works great on the first page and when returning to this page from another page.

I had hoped to call the same function inside "pagecontainertransition" to add the panel to other pages as well, but this doesn't seem to work:

//handle page transitions
$('body').on('pagecontainertransition', function(event, ui) {
    add_panel();
});

Can this be done?

Omar
  • 32,302
  • 9
  • 69
  • 112
vespino
  • 1,714
  • 3
  • 15
  • 28
  • `pagecontainertransition` will fire on each and every page, this will result in duplicate panels. if you visit the same page 3 times, you'll have 3 panels. Also, you'll have all panels in all pages with same id. http://stackoverflow.com/a/16414517/1771795 – Omar Oct 21 '14 at 10:46
  • I had hoped to solved the double panels issue with $("#leftpanel").remove(); within the function but this results in the panel not beeing on the first page when I return – vespino Oct 21 '14 at 10:48
  • why do you need to append and then remove panels? – Omar Oct 21 '14 at 10:54
  • To avoid double panels. I looking for a way to have to use only on html file and not insert the menu on each page. Can this be done? – vespino Oct 21 '14 at 11:08
  • like this http://stackoverflow.com/a/22636966/1771795 – Omar Oct 21 '14 at 11:15
  • I'm using pagecontainertransition because my app has multiple page. The example doesn't? – vespino Oct 21 '14 at 11:36
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/63405/discussion-between-omar-and-opolo-webdesign). – Omar Oct 21 '14 at 11:47

0 Answers0