How do you get the current page URL in jQuery Mobile 1.4.5?

Question

Please don't mark this as a duplicate. I have tried all the methods suggested on StackOverflow and none of them work. They all give me the URL of the referring page, not the current page. Or they don't work at all. Even window.location.href returns the referring page URL, not the current page URL. I'm using jQuery Mobile 1.4.5.

For example say I was on page1.php and I clicked a link to page1.php?getvar=42. Page 1 looks like this:

<!doctype html>
<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>
</head>
<body><div data-role="page" data-dom-cache="false">
<a href="page1.php?getvar=42">Click Here</a>
<?php if ($_GET['getvar']=='42'): ?>
<script>
console.log(window.location.href);
console.log(document.location.href);
console.log($.mobile.activePage.data('url'));
</script>
<?php endif ?>
</div></body></html>

When I click the link in the above page and I look at what it says in the console. I get:

http://hostname/page1.php
http://hostname/page1.php
/page1.php

I've also tried wrapping these calls to console.log() in a jQuery $(document).ready() function with no change in the result.

<script>
$(function() {
    console.log(window.location.href);
    console.log(document.location.href);
    console.log($.mobile.activePage.data('url'));
});
</script>

As you can see none of these are the complete URL. The same is true when linking to a different file. So it doesn't just affect pages with GET variables on the URL. I am expecting to see /page1.php?getvar=42

I've found topics on Stack Overflow that ask this same question but none of the answers are working for me. Perhaps they are using a different version of jQuery Mobile. I'm using jQuery 1.4.5 as you can see.

So far the only solution that I have found is to turn off ajax loading of pages in jQuery mobile by putting data-ajax="false" on a parent container. But there must be a better way.

(By the way, the reason I need this is so that I can reload the current page. But currently all attempts to reload the current page just take me back to the referring page. And this is why.)

This will help you http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript . What you are looking for is called Query String. — ProgrammerV5, Mar 29 '17 at 17:35
The query string isn't showing up in the URL. That's the problem. — phpguru, Mar 29 '17 at 17:38
Well, then you can't get what is not there :) you specifically said this "For example say I was on page1.php and I clicked a link to page1.php?getvar=42" — ProgrammerV5, Mar 29 '17 at 17:41
My point exactly. Just to be clear I'm talking about clicking a link to page1.php?getvar=42 and then checking the current location and getting page1.php even though I'm on page1.php?getvar=42. This is an artifact of jQuery Mobile's loading linked pages into the DOM with ajax. — phpguru, Mar 29 '17 at 17:51

score 0 · Answer 1 · answered Mar 30 '17 at 10:24

Try the following function. I used this peace of code in my project and it did well.

  var getUrlParameter = function getUrlParameter(sParam) {
    var sPageURL = decodeURIComponent(window.location.search.substring(1)),
        sURLVariables = sPageURL.split('&'),
        sParameterName,
        i;
    for (i = 0; i < sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {
            return sParameterName[1] === undefined ? true : sParameterName[1];
        }
    }
  };

phpguru · Answer 2 · 2017-03-29T19:15:11.340

-2

The answer is to wrap window.location.href in a setTimeout() call like this:

<script>
setTimeout(function() {
    console.log(window.location.href);
}, 0);
</script>

Wrapping inside of $(document).ready() call does not work, though.

edited Mar 29 '17 at 19:15

answered Mar 29 '17 at 18:47

phpguru

1
1

1

http://api.jquerymobile.com/jQuery.mobile.path.parseUrl/ you don't need to use setTimeoit nor ready. Use pagecontainer events. http://stackoverflow.com/a/26393037/1771795 – Omar Mar 29 '17 at 20:13

How do you get the current page URL in jQuery Mobile 1.4.5?

2 Answers2