In-page button, change api settings url for one button

[ershagen]

Hello!

I need some help with tabs. I use history true and apisettings: url 'pages/{tab}.php', and it works very well! But in my page products.php (with history it becomes products/ in addressbar) I have buttons so I can click and change my products. Then it becomes products/13 (the id on product) BUT! I use api settings, and it becomes pages/13.php... but I need this to be pages/one_product.php?id=13, how do I solve it? Please help!

It seems that I can't change none of my tabs if I already have a code for ONE tab.

My code:

   $('#menu .item').tab({
                  history: true,
                  cache: false,
                  apiSettings: {
                    url: 'pages/{$tab}.php'
                  }                 
              })
;

And if I trying to create a in-page button in products.php and change with this code; it won't work

 $('.tab-item')
              .tab({
                  history: true,
                  cache: false,
                  apiSettings: {
                    url: 'pages/one_product.php?id={$tab}'
                  }

              })
            ;

[jlukic]

See #2752 for more details

[ershagen]

Didn't solve my problem..

[jlukic]

Please create a test case, there's a JSfiddle to fork in the readme.

[ershagen]

Okey! I have this: http://jsfiddle.net/6opuecL2/

I have set history to false because it wont work on jsfiddle. You have to remove api settings url because it can't find any url in jsfiddle =)

Any idea?

[ershagen]

Okey. If I set history false on #menu .item it WILL do just like ".stab-item" when I hit the button. But I want history, on both..

[jlukic]

If you have two tab groups using the same history, you need to set a context for both sets of tabs.

[ershagen]

Like this?

$('#menu .item').tab({
    history: true,
    cache: false,
    context: $('#menu'),,
    apiSettings: {
        url: 'pages/{$tab}.php'
    }
});

$('.stab-item').tab({
    history: true,
    cache: false,
    context: $('#menu'),
    apiSettings: {
        url: 'pages/one_product.php?id={$tab}'
    }
});

[jlukic]

If one group is not suppose to close the other group, the context would be different. If they are all part of the same group you should init as

$('.stab-item, #menu .item').tab({
    history: true,
    cache: false,
    apiSettings: {
        url: 'pages/one_product.php?id={$tab}'
    }
});

For further help please use stack overflow or gitter.