CODEWITHSUNDEEP
javascriptjqueryjquery-mobile
Mahdi Ghiasi
Mahdi Ghiasi

Reputation: 15301

Pass parameter to the page in jQuery Mobile

I have two pages, p1.html and p2.html with jQuery Mobile.

There is some links in p1.html, and all links are navigating to p2.html but with a little difference.

I want to pass an int parameter to p2.html javascript (for example, link number), So a javascript code in p2.html, make little changes to itself based on the int parameter (Before transition starts).

I want to use Ajax navigation feature and Transitions of jQuery Mobile, And I don't want use page anchors (p2.html#6).

How to send that parameter to p2.html?

Upvotes: 1

Views: 1780

Answers (3)

AndrewR
AndrewR

Reputation: 6748

Can you use cookies to save the relevant information?

Get the cookie jquery plugin.

p1.html

<a href="p2.html" data-p2data="1">Link 1</a>
<a href="p2.html" data-p2data="2">Link 2</a>
<script type="text/javascript">
$(document).ready(function(){
    $('a[data-p2data]').click(function(){
        $.cookie('p2data', $(this).data('p2data'));
    }
}
</script>

p2.html

<script type="text/javascript">
    var p2data = $.cookie('p2data');
    // .. process the page based on the value in p2data.
</script>

Upvotes: 2

Zathrus Writer
Zathrus Writer

Reputation: 4331

You can use a global variable to store that numeric value when a link on page1.html is clicked:

$('a.special_link').click(function() {window.my_id = this.id});

... you will be then able to retrieve this in page2.html, since JQM uses AJAXed navigation by default, thus staying on a single page with this variable still accessible:

$('document').on('pagebeforechange', function(toPage, data) {
    if (toPage == 'page2.html') {
        alert('you have clicked on link number: ' + window.my_id);
    }
});

Upvotes: 1

Jack
Jack

Reputation: 10993

From the docs there is no built in way to pass parameters between pages.

However you can use one of the plugins mentioned there (page-params or jquery-mobile-router) or you can use localStorage or cookies.

Have a look at some of these SO questions

Passing data between pages with jQuery Mobile?

Passing parameters to a page-id in jQuery Mobile

How-to store variable beetween jQM pages?

Upvotes: 1

Related Questions