Routable tabs bug (v2 / with pushState)


on the router js i have the following code.
when i click on tab2 he changes in the url the filled id & name param
back to the :id/:name placeholder. this seams to be a bug.

    path: '/team/:id/:name/',
    componentUrl: './pages/team.html',
    tabs: [
        path: '/',
        id: 'tab1',
        path: '/tab2/',
        id: 'tab2',
        path: '/tab3/',
        id: 'tab3',


i reply myself because if found a second error.
when you are in a tab and you link to the same route (but with different params) f7 will not detect it
and will not follow the link.

for example you are on /#!/team/125393/nicename/tab2/
and you link from there to /#!/team/11421/nicename2/tab2/

ps the whole tab feature is build on id-detection. couldn´t this conflicts with the page-previous features
(the same id´s multiple time in dom)

Yes, displaying tabs is based on their IDs, will check what can I do with this


thank you for your anwser.
independent of the thing with the id´s (maybe there could be a workaround?) i think there are two more bugs.
i uploaded 3 screen for you. the first two screens show the first “bug” (with the replacement to placeholders)
the last screen shows the “bug” of not following the link in that case.

Ok, i have fixed it in github, so will be available with next release

1 Like

hello nolimits4web,

i checked it out and you fixed both “bugs”. really good job!

i dont know why, but at the moment the system have no problem that in "page page-previous"
and in “page page-current” the same html “id´s” exists. :neutral_face::thinking:

Yes, now same IDs should work fine

it may work but is it correct to have multiple id´s in dom :slight_smile: ?

Yes, it is fine, just make sure that if you want to reference such elements, make sure you use more specifci selector like $('.some-page #tab1')...

okay i m happy that i works … but having same id´s in the DOM is just a “undefined behavior” and will work
because browsers dont care about this. (hoppyfully browsers dont will change that)