Monaca Onsen UI Discord Chat Github Repo

combining tabbar and navigator not working in Safari

  • Hi there,

    i would like to build an app that has an tabbar as main navigation and an navigator inside of every tab.
    Inside the tabs a have a navigator for the list navigation.

    The code for tabbar

    <ons-tabbar id="tabbar" animation="slide" position="auto">
            <ons-tab page="index.html" active icon="ion-search" label="Home" style="display: none;"></ons-tab>
            <ons-tab page="rezeptNavigator.html" icon="ion-search" label="Rezepte"></ons-tab>
            <ons-tab page="mehl.html" icon="ion-mehl" label="Mehlsorten"></ons-tab>
            <ons-tab page="impressum.html" icon="ion-impressum" label="Impressum"></ons-tab>

    and the navigator - one for every tab

    <ons-template id="rezeptNavigator.html">
            <ons-navigator id="rezepte" page="rezepte.html"><ons-navigator>

    and the page itself

    <ons-template id="rezepte.html">

    when you click an listitem i call navigator.pushPage(‘templateId’…);

    And this all works fine in Chrome but in Safari it will not update the page!

    I have tried more than one way to do this and all of them has worked in Chrome but not in Safari.
    I dont know what iam missing.

    Please can anyone help me out with this problem.

  • Me too have problems with the ons-tabbar in IOS. For me, no matter there is navigator or not , when open page with tabbar in it, different errors appear in IOS (Android is fine). Please ONSEN team have a look at it.

    Thanks in advance.

  • @Altin Can you post a codepen with the code that is not working?

  • Ok. Firstly @munsterlander sorry that didn’t create the codepen, because I wanted to wait for the 2.0.2 release. After update the OnsenUI with the lastest release, these problems disappeared, but other problems shown up. Than I update angularjs to the lastest (from 1.3 to 1.5.8) and all the problems are gone now, related to this report.

    So thanks for the release and support.