i'd like to have a persistent navigation footer on my page (like here: http://jquerymobile.com/demos/1.0a2/#docs/toolbars/footer-persist-a.html ). i am using the exact code being used there, and yet the footer is rendering multiple times on one page (with different items selected). one bar is appearing right under my content and the other at the bottom of the page. clicking on either seems to work (takes me to the page i clicked on), though it is buggy.

the only difference between my code and that code is that i'm moving between # pages, and they're moving between .html pages. here's my code:

For what it's worth I'm having this trouble too, but I'm pretty new to all this. I thought about trying to code it so that the footer is only coded once, but even if that did work (I couldn't get it to), you wouldn't be able to set the respective buttons to active with class="ui-btn-active".

And like veeplus said, having separate footers in each #page is very buggy. I'm finding the persistent navbar to be very buggy in general, so it's hard to say which problems exist because of #pages and which are just general persistent navbar bugs.

Same problem (with already in-memory pages being navigated to with href='#page2' etc.)

Multiple footers/toolbars appear after navigation.

Looking at my DOM post page switch I see that each page now has all footers on it.

The page switching code appears to be cloning all the footers into each page.

From an architecture point of view, shouldn't a persistent footer live OUTSIDE the page ?, as a seperate DOM node (analogous to dialogs) It would handle changing the active button (toggling ui-btn-active class as needed) and there would be no need for copy-paste code to get the same footer onto each page....