Search code examples
jqueryjquery-uijquery-ui-tabs

jQueryUI tabs... appending content to inactive tab, content stays hidden when tab is clicked/activated


Hey all... I've got a jQueryUI tabs implementation that's pretty straightforward and working fine. Well, was :)

I'm appending content to one of the tabs, while the tab is inactive. When I click the tab, the content isn't visible. Firebug shows it's there, but with a css attribute of display:none.

I imagine that when a tab is inactive, all of the content within is set to display:none;, and when the tab is clicked, that content is set to display:block (or inline, not sure which). I'm assuming that because I appended the extra content after the page loaded, jQuery isn't "aware" of it. So guessing I need to work the .live() method in there somewhere, but not sure where, as it would seem that I'd have to manipulate the jQuery tabs code itself?

Don't really have any relevant code to post, as it's all pretty straightforward... but if anybody thinks it will help, I will throw some snippets up here.

To summarize... if appending data using jQuery's .append() to a node that's currently an inactive jQueryUI tab... how can I get that data to display when the tab becomes active?

Thanks!


Solution

  • It should work with append() and jquery UI. Are you sure that you're appending data to tab data container only? I suppose you're doing something like working demo only.