fatkatie Posted September 23, 2017 Share Posted September 23, 2017 This is a pretty general question, but I'm hoping for a best way suggestion before I go off and code a 1000 lines which will have to be redone. Even a 'Yah, this is the best way to do this' would be appreciated from someone who's done this before. Can you possibly get at elements inside a Bootstrap inactive nav nav-tabs element? I have a 'workbench' with multiple nav-tabs. When I change something in a active tab, I need to update a div element in other inactive tabs. Makes sense you can't see it. Is there a way to, or is the nav truly not loaded? (You can see all the html for all the tabs in the page, it must be 'hidden'?)If that's so, I would need to rely on a tab load event and let that tab refresh itself. Right? Put the updated data in a form that is available to all tabs and populate this form with hidden values. Is that the way to do this? Thanks for any suggestions. Link to comment Share on other sites More sharing options...
requinix Posted September 23, 2017 Share Posted September 23, 2017 If you can inspect the HTML on the page, live not just with View Source, and it has the right combination of IDs and/or classes then yes, you can. And I'm 95% sure that will be the case for you. Knowing the actual HTML structure would make it easier to say what the selector you'd need is. Link to comment Share on other sites More sharing options...
fatkatie Posted September 24, 2017 Author Share Posted September 24, 2017 Here's a stripped down example of what I have. Whole html pages (the content of each tab) are assigned to variables and those variables are echoed within the tab content area. Everything works as expected except js executed by one tab (the active tab) cannot see elements in others (inactive tabs). All the js used by all the tabs are contained in <head>. 'select' tab js attempt to modifiy 'adjust' tab element <div id='idd_testadj' ... will fail. 'select' tab js can manipulate it's own elements. It appears that the Bootstrap class has hidden content and I don't know how to get at it. // Stripped down exmample $tab_create_content = "<div id='idd_testselect'>select me</div>"; $tab_adj_content = "<div id='idd_testadj'>adjust me</div>"; Standard html begin HERE <div class='container'> <div class='row'> <div class='col-md-1'></div> <div class='col-md-10'> <div class='bs-example'> <ul class='nav nav-tabs' id='myTab' > <li class='active'><a data-toggle='tab' href='#sectionselect' >Select</a></li> <li><a data-toggle='tab' href='#sectionadjust' >Adjust</li> </ul> <div class='tab-content'> <div id='sectioncreate' class='tab-pane fade in active'> <br> <?php echo $tab_create_content;?> </div> <!-- end tab content create --> <div id='sectionadjust' class='tab-pane fade'> <br> <?php echo $tab_adj_content;?> </div> </div> <!-- tab-content --> </div> <!-- bs-example --> </div> <!-- div 10 --> <div class='col-md-1'></div> </div> <!-- row --> </div> <!-- container --> standard html end HERE Link to comment Share on other sites More sharing options...
requinix Posted September 24, 2017 Share Posted September 24, 2017 Then I'd say you can forget about the nav thing. That only shows and hides content - it still exists on the page, so you can certainly manipulate it whenever and however you want. Link to comment Share on other sites More sharing options...
fatkatie Posted September 24, 2017 Author Share Posted September 24, 2017 OE! Thanks for the feedback. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.