I’ve got my field group set up with tabs, and I’m displaying it on the frontend of my site. I know I can click on the tab button to show/hide the content of each tab. But I can’t figure out a way to use a completely different button to handle the show/hide of the tabs.
Here is an example page on my site – http://lorebook.twistedjackal.com/malachidraven/universe/dawn-of-insanity/
Account Details to demo functionality:
Username: demo
Password: demo
If you look at that page, you’ll see that I have one <div> set up with multiple tabs displaying various fields. If you hit the Edit button, it hides that div and replaces it with another div containing my acf form.
What I would like is to use my tab buttons on my first div to also control the tabs on the acf form inside the other div.
I’ve tried a few options, but so far I haven’t gotten anything to work. I just need to know how to use a button of my own creation to control the tabs on the acf form.
Just some thoughts.
Create a button and attach a click event to it. In your code trigger the click even on the tab that you want to show using the field key of that tab, something like this.
$('a[data-key="field_590de29e84ef8"]').trigger('click');
`