Menu icon Foundation
Foundation Tabs After Dynamic Loading

I am in the process of using tabs within a Modal. Though, this modal is fetched and loaded into the DOM dynamically. Does Foundation still listen / put hooks into these new elements? The issue I am seeing, is when I click on the other tabs (outside the active tab) nothing happens.

This makes me think that Foundation Tabs only does initial hooks on page load; if this is the case, I did not see a way to hook the new dynamic tabs into Foundation.

tabsFoundationdynamicloadingdomworking

I am in the process of using tabs within a Modal. Though, this modal is fetched and loaded into the DOM dynamically. Does Foundation still listen / put hooks into these new elements? The issue I am seeing, is when I click on the other tabs (outside the active tab) nothing happens.

This makes me think that Foundation Tabs only does initial hooks on page load; if this is the case, I did not see a way to hook the new dynamic tabs into Foundation.

This post has been closed. No new replies can be added.

Oleg Gryaznov almost 5 years ago

Put $(document).foundation(); into onclick attribute for the button that creates new tab after the tab is created. It will bind created tab.

Rafi Benkual almost 5 years ago

Or you can reflow

$(document).foundation('tab', 'reflow');

James Dobry almost 5 years ago

Since there will be multiple tabs, I went with the reflow option, as there was multiple tabs and I didn't want to rebind all of foundation a second time.