I've set up some tabs in Layouts with accordions nestled in the tabs. I'm trying to link a button from one tab to the next, so that when the button is clicked, it opens another tab. (or even be opened by a link from a different page straight to the tab).
The problem I have is that the ID of the tabs keep changing every time the page reloads so can't href to it.
Any ideas?
Hello. Thank you for contacting the Toolset support.
Yes - due to security reasons we used to change the IDs of the html element.
jQuery( document ).ready(function($) {
// to get firest div ID
id1 = jQuery('div.tab-content div.active"]').attr('id');
// to get second div ID
id2 = jQuery('div.tab-content div.tab-pane:nth-child(2)"]').attr('id');
// to get third div ID
id3 = jQuery('div.tab-content div.tab-pane:nth-child(3)"]').attr('id');
});
Thanks for the info Minesh. I appreciate this is being done for security. How can I link to the tab panes then?
Would I need to change this behavior and make the tab-panes static?
Sorry if you feel you've already answered this, but it not really clear to me how I can link to the tab-panes.
Well - I do not get you what you want to link with tab panes.
Could you please share problem URL and tell me what exactly your requirements?
*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.
I would additionally need your permission to de- and re-activate Plugins and the Theme, and to change configurations on the site. This is also a reason the backup is really important. If you agree to this, please use the form fields I have enabled below to provide temporary access details (wp-admin and FTP).
I have set the next reply to private which means only you and I have access to it.
Hi Minesh.
Thanks for your response with the scripts for getting the ids.
I have set up a testsite for you to have a look at what I'm trying to get at.
I have a YES buton on tab 1 that I want to click...then it takes me to tab 2.
I also have a link on tab 2 that I want to click...then it takes me to accordion panel 2 on the same tab.
testsite is hidden link
log-in details:
To log-in, go to: hidden link
Login name: eriq
Password: i1y4B5ES5yI^
I've added the following code to layouts CSS and JS editor:
/*Layouts js goes here*/
jQuery(document).ready(function($){
$('#myModal').on('shown.bs.modal', function () {
$('#myInput').focus();
});
// To open the 2nd tab
$('.tb_1_btnyes').click(function(){
jQuery('.nav-tabs li:eq(1) a').click();
});
// to open the 2nd accordion
$('.second_accord').click(function(){
jQuery('.panel-group div.panel-default:eq(1) a').click();
});
});
I hope above solution will help you to resolve your issue.
