CODEWITHSUNDEEP
javascripthtml-framework-7
Utpal - Ur Best Pal
Utpal - Ur Best Pal

Reputation: 4532

Pass Variables in Url in Framework7 Inside Pages

I am new to Framework7.io. I have got the following script which fetches the data from sqlite based on the parameters passed in the url.

However all the Js is called in index.html (the first page of F7), whereas I have get parameters in the inside pages.

code in b.html

<a href="a.html?type=new&ok=fine" >Go to a with values of ok & type</a>

code in a.html

function getParameterValue(type) {
    type = type.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + type + "=([^&#]*)"),
    results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
var type1 = getParameterValue('type');

Update:

Currently using this code with no successs.

$$(document).on('page:init', function (e) {
    var page = e.detail.page;
    myApp.alert(page);

    if (page.name === 'a') {
        var count = page.query.count;   
        myApp.alert(count);
        // Now we can generate some dummy list
        var listHTML = '<ul>';
        for (var i = 0; i < count; i++) {
            listHTML += '<li>' + i + '</li>';
        }
        listHTML += '</ul>';
        // And insert generated list to page content
        $$(page.container).find('.page-content').append(listHTML);
    }
    // Code for Services page
    if (page.name === 'inch') {
        myApp.alert('Here comes our inch!');
    }
});

Thanks for your time and any help is highly appreciable.

Upvotes: 3

Views: 5362

Answers (1)

Agus Sapurta Sijabat
Agus Sapurta Sijabat

Reputation: 511

Use page.query.your_url_parameter to get the parameter value.

Example:

To get <a href="a.html?type=new&ok=fine" >Go to a with values of ok & type</a> parameter :

$$(document).on('page:init', function (e) {
var page = e.detail.page;

if (page.name === 'a') {

    var type = page.query.type; // returning "new"
    var ok = page.query.ok; // returning "fine"

    alert(type); 
    alert(ok);

}
// Code for Services page
if (page.name === 'inch') {
    myApp.alert('Here comes our inch!');
}

});

Please see the documentation

Upvotes: 4

Related Questions