How can change document/app title dynamically?

Questions
1

Hello.

I’m new to Framework7. Browser title does not change while browsing. I tried document.title, it doesn’t work. I tried with Settimeout, it didn’t happen. I’m calling in MainView vanilla javascript but it doesn’t change the title.

How can change document or app title dynamically?

2

document.title = “Hello”

works for me…

If you mean something else, please give a little more detail or code…

3

My pages are like that, am I doing it wrong? I’m using a web-based so each page is like a single page. I’m not a professional.

index.html

<!DOCTYPE html>
 <html lang="en">
  <head>
   <title>Page index</title>
   <!--a lot of meta and css-->
  </head>
  <body id="app"> 
   <div class="view view-main">
    <div data-name="home" class="page">
     this is a main page and <a href="/index/other-page.html">other page</a>
    </div>
   </div>
   <!--js files-->
  </body>
 </html>

other-page.html

<!DOCTYPE html>
 <html lang="en">
  <head>
   <title>hello from other page but not showing title :(</title>
   <!--a lot of meta and css-->
  </head>
  <body id="app"> 
   <div class="view view-main">
    <div data-name="home" class="page">
     this is a other page
    </div>
   </div>
   <!--js files-->
  </body>
 </html>

my app.js

var app=new Framework7({
  root: '#app',
  name: 'My App',
  id: 'com.myapp.test',
  statusbar: {
    iosOverlaysWebview: true,
  },
  theme: 'ios',
  iosTranslucentBars: false,
  touch: {
    iosTouchRipple: true,
  },
  navbar: {
    hideOnPageScroll: false,
    iosCenterTitle: false,
  },
  view: {
    iosDynamicNavbar: false,
    xhrCache: false,
    pushState: true,
    history: false,
  },
 dialog: {
    title: 'My App',
  },
  routes: [
    {
      path: '/index/',
      url: 'index.html',
      options: {
       transition: 'f7-parallax',
     },
    },
  ],
});
var mainView=app.views.create('.view-main');
4

ok solved problem with this code

app.views.main.router.on('routeChanged', function(newRoute, previousRoute, router){
  document.title=$$('.page-current .title').html();
});
1 Like