window.location.hash returning empty string in pagecreate event

Question

I have a page that has a link to an internal page,please find the code below.

<body> 
    <div id="serviceDetailsPage" data-role="page">

        <div data-role="header" data-position="fixed" data-tap-toggle="false" data-theme="e">
        </div>

        <div data-role="content">

           <a class="loadAudio" data-role="button" data-mini="true" data-inline="true" href="#testPage">test</a>

        </div>      

        <div data-role="footer" class="footerLinks" data-position="fixed"> 
        </div> 
    </div>

    <div id="testPage" data-role="page">

        <div data-role="header" data-position="fixed" data-tap-toggle="false" data-theme="e">
        </div>

        <div data-role="content">

           testPage

        </div>      

        <div data-role="footer" class="footerLinks" data-position="fixed"> 
        </div> 
    </div>

    <script>
    $('#testPage').live('pagecreate',function(){
        console.log(window.location.hash);//returns an empty string
       console.log(window.location.href);//returns old URL
    });
    </script>

    </body>

When the page loads the URL is

../MyApp/index.html

after clicking the link the URL changes to

../MyApp/index.html#testPage

Im getting the old URL when I use window.location.href,i thought i would be getting the updated URL.And window.location.hash return an empty string.Is this because Im calling them at wrong event of the page?

My first thought is isn't '#testPage' the value you're looking for? Could you explain more as to what you're using 'pagecreate' for? In the docs I think it's being deprecated http://jquerymobile.com/demos/1.1.0/docs/api/events.html — Phill Pafford, Jun 29 '12 at 13:39
@PhillPafford its not that i want to use 'pagecreate' i posted another question http://stackoverflow.com/questions/11260792/get-param-value-from-a-url-in-jquery-mobile which Im struggling to get an answer.I knew it was something to do with 'pagecreate' event,hence I posted this question.Im trying to pass data between pages,would you please be able to suggest a working solution? — manraj82, Jun 29 '12 at 13:46
@manraj82 would local / session Storage work? http://www.w3schools.com/html5/html5_webstorage.asp — Phill Pafford, Jun 29 '12 at 13:59
cheers Phill im using this http://blog.digitalbackcountry.com/2011/12/passing-data-between-pages-in-jquery-mobile/ as a solution for now,instead of span i have got a hidden control that stores the id.Hope jQM comes up with a more robust solution — manraj82, Jun 29 '12 at 14:06

score 0 · Answer 1 · answered Jul 02 '12 at 01:39

Your getting the old url because you're checking at pagecreate, when you haven't yet navigated to the new url (the testpage is created before it is navigated to). If you instead were to check at pageshow, you'd be getting a correct value (but different strings) with both your methods. You could also use $.mobile.activePage.attr("id"):

$( document ).delegate('#testPage', 'pageshow',function(){
   console.log(window.location.hash);
   console.log(window.location.href);
   console.log($.mobile.activePage.attr("id"));
});

(I also used .delegate instead of .live)

window.location.hash returning empty string in pagecreate event

1 Answers1