header text removed after coming back from page with navbar

header text removed after coming back from page with navbar

This is probably a bug, but I'm a newbie so it could also be that I'm not using the library in a correct manner.

I'm developing an html5 mobile app using jQuery Mobile v1.3. In this app there's a login page. In the header section, I've placed a regular text-only header with no buttons:

  1. <div data-role="header">
        <h1 id="login_header">Default text</h1>
    </div>


The header has a default text that I'm resetting to a different one in the "pageinit" and "pageshow" event callbacks for i18n purposes:

  1. $(document).on("pageshow", "#my_login_page", function() {
        $("#login_header").text("Another text");
    });




At this point everything is ok: the callbacks has been executed and the title shown is "Another text". Then after the user logs in, a second page is shown. The page change is done calling "$.mobile.changePage". After changing the page, the previous page is still in the DOM, but hidden (I think this is called multi-page template?)

This second page has a navbar inside the header instead of a text title. This is how the html for the second header looks like:

  1. <div data-role="header">
        <div data-role="navbar">
            <ul>
                <li><a href="#" id="tab1" class="ui-btn-active">Menu 1</a></li>
                <li><a href="#" id="tab2" >Menu 2</a></li>
            </ul>
        </div>
    </div>








The hrefs do not contain urls because I need to handle the clicks from JS code. When tab2 is clicked, I'm programmatically calling changePage to go back again to the first page. And the text inside the h1 is back to the default value. Instead of showing "Another text" it shows "Default text". I've debugged the app, set breakpoints to debug the transition from page 2 back to page 1. I've noticed that in this change, when the first page's "pageinit" callback runs (still page 2 shown), or even executing "pageshow" callback (about to show page1 again) the text is still ok (contains "Another text"). After this, JQM removes the text inside the h1 (the one with id=login:header) and resets it to the default value.

So my questions:
  1. Why is JQM resetting the header after calling pageshow?
  2. Any suggestion on which event could I bind to so that I could perform i18n on the first page's title back to the correct value? It should be one of the very last events called after JQM has finished loading and messing up everything

Thanks in advance.