Steven
Steven

Reputation: 19455

Cached pages is affecting jQuery selectors

I'm using JQM for my hybrid app. Each page is a separate HTML file and JQM is loading the pages using Ajax.

Each pages has a footer with a menu bar. Depending on some criteria's, 2-4 menu items is shown. If I have to remove some menu items, I run a js script and it starts with:

var footer = $('#' + activePage +' footer [data-role="navbar"]');

The active page is set using this code:

var activePage; // Global variable

$(document).on( "pagecontainerbeforeshow", function( e, ui ) {
   activePage = ui.toPage.prop("id");
});

The problem is that after I navigate through a couple of pages, I suddenly have 2 footers. So when I count the number of <li> items, I get for example 2 + 4. 2 from the first footer and 4 from the second.

What can I do to avoid retrieving the cached pages?

Upvotes: 0

Views: 25

Answers (1)

ezanker
ezanker

Reputation: 24738

The pagecontainer widget has a method, getActivePage(), which does what you want.

So you could do something like this:

var footer = $("body").pagecontainer( "getActivePage" ).find('.ui-footer [data-role="navbar"]');

Then you don't need to try and save the active page id on page show anymore.

Working DEMO

Upvotes: 1

Related Questions