In my index.html, there are list of restaurant which is fetched from server database. On clicking a restaurant, user goes to restaurant details page (i.e. 2nd page) and then clicking the link on 2nd page, user goes to 3rd page. Now when click the ‘back link’ on top, they come to second page and then again clicking “back link” comes to index page but the content on index page (i.e. list of restaurant) disappears.
There are many solutions posted here on this forum which are of old framework7 version so none of them works for me.
I am using latest version of framework7 - v.3.0
In my index.html, I have this-
<div class="hotellist"></div>
And in my App.js, I have -
// Dom7
var $$ = Dom7;
// Theme
var theme = 'auto';
if (document.location.search.indexOf('theme=') >= 0) {
theme = document.location.search.split('theme=')[1].split('&')[0];
}
// Init App
var app = new Framework7({
id: 'io.framework7.testapp',
root: '#app',
theme: theme,
data: function () {
return {
user: {
firstName: 'John',
lastName: 'Doe',
},
};
},
view: {
iosDynamicNavbar: false,
xhrCache: false,
},
methods: {
helloWorld: function () {
app.dialog.alert('Hello World!');
},
},
routes: routes,
vi: {
placementId: 'pltd4o7ibb9rc653x14',
},
});
var view = app.views.create('.view-main', {
url: '/',
});
app.request.post('http://localhost/foodonline/listhotel.php',
{ index: 'default' },
function (data) {
var data = data;
$$('.hotellist').html(data);
});
Rest of my html pages are through route,js
Please suggest. Thanks