Languages

Menu
Sites
Language
Triggering pageshow event a second time

Hi,

I have a page A where the 4 events pagebeforeshow, pageshow, pagebeforehide, pagehide are bound. The user now navigates to page B and from that page, there are two ways back to page A:

1) by using window.history.back();

2) by using tau.changePage('PageA.html');

 

The problem now is that page shows a different behaviour for both scenarios. In 1) the pageshow events are beeing triggered as expected; with 2) they are not! My problem is that I need that these events are beeing triggered, but I cannot use windows.history.back as is is not proper and I need to go back to page A from anywhere from the application.

Why is 2) not triggering those events and how can I force them to do so?

List

Responses

4 Replies
Seoghyun Kang

Dear Philippe Wechsler,

 

Firstly, I think it is not a good way to divide the page when you use the "TAU.changePage".

That's because TAU does not reload the page. I remember that TAU is using just "Show" and "Hide" as jQuery Mobile.

So I recommend you use the one page if you use the TAU.changePage.

 

If you want to use the page event, you can use the "location.href="xxx.html".

But I do not recommend it if you use the TAU. That's because of the performance.

 

Thanks.

 

Best regards,

Seoghyun Kang

Philippe Wechsler

Is that with the show and hide documented anywhere? Because that's exactly what I feared and that explains a lot of problems I had. Unfortunatley the behaviour in the browser (ctrl+4) is then entirely different from whats actually happening on a real device! Confusing seems not really the right word...

 

So what you're suggesting is actually write the entire app into one single html file containing all the pages?!?

Marco Buettner

Yeah, its recommended to use one html file.

<body>
    <div data-role="page" id="page_one">
        <div data-role="header"></div>
        <div data-role="content"></div>
        <div data-role="footer"></div>
    </div>
    
    <div data-role="page" id="page_two">
        <div data-role="header"></div>
        <div data-role="content"></div>
        <div data-role="footer"></div>
    </div>
</body>

 

AVSukhov

hello,

changePage() reloads what's inside the <div data-role="page"> element. Make sure that the event handler added  to proper element.