Skip to content

When leaving from a page contains nested listview, pageremove event does not fire. #4185

fukudayasuo opened this Issue Apr 24, 2012 · 13 comments

4 participants


When move to a page from the page contains listview, pageremove event does not fire.

I create the pages for test.
test1 is top page. test3 contains listview. When move from test3 to test1, pageremove event does not fire.

I tried jQueryMobile ver 1.0.1 and 1.1.0, and also I tried jQuery-1.6.4, 1.7.1.
But the result is same.
Trying Chrome, Firefox, IE, but the result is same.

Isn't this a bug?

jQuery Foundation member

Hi @fukudayasuo

I was about to comment that your pages should have unique ID's but I noticed you just changed that.
Can you change your fiddle so it loads jQuery 1.7.1 instead of 1.7.2 (not supported yet).
Also your list looks like

  • That should be other way around ;-)

    Update: sometimes code is not shown in comments here. In case it is not visable on last line: LI UL / UL / LI

    jQuery Foundation member

    When you inspect the code after you returned from page with ID test3 (title in heading says test2) to the first page with ID test1 you'll see that test3 has been removed from the DOM. So it is only the alert that doesn't pop up. What happens when you put the function in the head section?


    Thank you for comment.

    I fixed jQuery 1.7.2 to 1.7.1

    But result is same. I tried to put the function in the head section, but result is same.

    I know that DOM is removed. I care "pageremove" event does not fire.

    "pageremove" event is binded in line2898 in But when the page has listview, "pagehide.remove" event is unbinded and binded the new function named newRemove in line 5166-5181. But newRemove function does not trigger event "pageremove".

    So, when page has listview, "pageremove" event does not fire.

    jQuery Foundation member

    You're welcome! Always nice to help former prime minister of Japan ;-)

    Anyway... I looked at your new fiddle and it seems to work (test on Chrome/Windows). I get pageremove alert when going back from test3 to test1. Did you test again on Chrome? Mac or Win?

    I know it's just a test and I don't want to be over-fussy, but to rule out possible causes of the issue...
    You now have two UL's with data-role="listview" and nested the second directly inside the first . For listview you only have to use data-role listview on the first UL and the framework generates a new page to display nested lists.

    <ul data-role="listview">

    Oh... Certainly running. I haven't notice...

    OK, I understand when the issue happen. It is when use nested listview. That is when generated new page.

    I tried nested listview. The issue happens.

    jQuery Foundation member

    Yes I can confirm this issue:

    When a page contains a list with a nested list, both the page and the framework generated nested list page get removed from the DOM but you can't bind to pageremove.

    I compared the page remove function with the 'specialized' version used when there are subpages. Triggering the pageremove event is indeed missing in last one.


    Thank you for checking the code.
    I think the 'pageremove' should be triggered even when we use a nested listview,
    So I'm hoping for the fix this issue.


    I updated the title to reference nested listviews. @uGoMobi - do you think you know the nav script well enough to create a pull request?

    jQuery Foundation member

    @toddparker Sure, I will create a PR to fix this.


    Thanks @uGoMobi!

    jQuery Foundation member

    There is more to fix. In case you leave a listview page that contains a nested list it is just the pageremove event that doesn't fire, but when you leave a generated nested listview page nothing is removed from the DOM as well.

    To reproduce:
    Go to Nested Lists in the docs ( > Animals > Pets > Canary
    This brings you back to Lists index.html and all nested listview pages (and the parent listview page) are still in the DOM.

    I am looking into a complete fix.

    jQuery Foundation member

    On second thought... maybe it is on purpose that the pages remain in the DOM when you leave a nested listview page. Otherwise it seems you can't nav back to them with the back button, unless they are still in the browser cache.

    Anyway, I saw a couple of 'TODO' comments in the JS regarding page removal handling, so I figured it was better not to touch this for now. I will just create a PR to fix the original issue about the pageremove event that doesn't fire.


    @uGoMobi - yes, I think we decided to leave the nested list pages in the DOM until you load another page so if you hit back, the pages are still there. Sort of a practical compromise.

    @scottjehl scottjehl pushed a commit that closed this issue May 16, 2012
    @jaspermdegroot jaspermdegroot Fixes #4185 - When leaving from a page contains nested listview, page…
    …remove event does not fire
    @scottjehl scottjehl closed this in 5b38553 May 16, 2012
    Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
    Something went wrong with that request. Please try again.