-1

My clients site uses K2 and SW Tabs Pro. The client wants a button at the bottom of the content of the first tab that switches to the tab titled 'Pošalji upit'.

For example, on this page this is #tab18 however, on this page is is #tab17. Is there a simple way to create a button on the 'O putovanju' tab that will, when clicked, switch to the 'Pošalji upit' i.e. by using the name of the tab for example, as the tab ID itself changes?

Thank you in advance.

D

2
+50

I'm not sure why it changes ID when you show it. It would be much more practical to keep the same ID and then Dennis Heiden's answer would be the best approach.

What you are asking for can be easily achieved, using the following jQuery, which is closely described here, too.

jQuery('#tab-container li.tab a:contains("Your Tab Text here")').click();

You could place it in a function in your scripts, like:

function openK2TabByName(name) {
  jQuery('#tab-container li.tab a:contains("'+name+'")').click();
}

Then, a button would look like:

<button onClick="openK2TabByName('Pošalji upit')" id="customTabButton">Pošalji upit</button>

And a link would look like:

<a href="javascript:void(0);" onClick="openK2TabByName('Pošalji upit')" id="customTabLink">Pošalji upit</a>

UPDATE:

Since you want to hide the button when the link is active, you need to somehow "catch" the tab clicking. Thus, you would have to write something like the following, in your Javascript:

jQuery('#tab-container li.tab a').click(function() {
  if (jQuery(this).html().indexOf("") !== -1) {
    // If this is the Pošalji upit tab, hide the button, or link.
    jQuery("#customTabButton").hide();
  }
  else {
    jQuery("#customTabButton").show();
  }
});
  • This works brilliantly, thank you. Unfortunately the tabs are generated based on extra fields, so depending on how many are filled in, the tab numbers change. I have one more problem - Is it possible to hide the button when the form is visible? I.e. after switching to the Pošalji upit tab (when it is active). – Dtorr1981 Nov 14 '17 at 11:11
  • Hello and thank you for your comments. If it works, please accept the answer. You can certainly make it hide the button when it is open, but it is a little hard to describe it here. I will update my answer. – mavrosxristoforos Nov 14 '17 at 15:28
  • Thanks Max, I haven't had a chance to test the updated code yet. I will report back once I have implemented it and confirm :) – Dtorr1981 Nov 16 '17 at 12:15
  • @Dtorr1981 Thank you for your update. It would be nice to grant the bounty if you got the expected result. Thanks again. – mavrosxristoforos Nov 16 '17 at 16:34
1

jQuery:

<button onclick="jQuery('#swtabs18').trigger('click');">Open Tab 18</button>

Vanilla JS:

<button onclick="document.getElementById('swtabs18').click();">Open Tab 18</button>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.