Как выгрузить вкладки jquery ui, которые скрыты / не активны?

Question

Я использую вкладки Jquery UI в моем веб-приложении asp.net mvc.

У меня всего 6 вкладок. Каждая вкладка содержит пользовательский элемент управления.

Я динамически загружаю содержимое в каждую вкладку, используя ajax, например:

 <div id="tabs" style="clear: both" align="center">
        <ul>
            <li><a href="<%:Url.Action("AddControl","App",new {id=Model.ID}) %>">
                <span>Tab </span></a></li>
            <li><a href="<%:Url.Action("Control","App",new {id=1,data=Model.ID}) %>">
                <span>Tab1</span></a></li>
            <li><a href="<%:Url.Action("Control","App",new {id=2,data=Model.ID}) %>">
                <span>Tab2</span></a></li>
            <li><a href="<%:Url.Action("Control","App",new {id=3,data=Model.ID}) %>">
                <span>Tab3</span></a></li>
            <li><a href="<%:Url.Action("Control","App",new {id=4,data=Model.ID}) %>">
                <span>Tab4</span></a></li>
            <li><a href="<%:Url.Action("Control","App",new {id=5,data=Model.ID})%>">
                <span>Tab5</span></a></li>
        </ul>
        <div id="tab1">
        </div>
        <div id="tab2" >
        </div>
        <div id="tab3" >
        </div>
        <div id="tab4" >
        </div>
        <div id="tab5" >
        </div>
        <div id="tab6">
        </div>
    </div>

Как видно, вкладка 2 - вкладка 6 содержит тот же пользовательский элемент управления. Данные будут загружены на основе нажатия вкладки.

здесь моя проблема заключается в том, что после того, как вкладка загружена, нажали на другую вкладку, остальное содержимое вкладки просто скрыто.

Поскольку я использую одни и те же элементы управления, я сталкиваюсь с некоторыми проблемами.

Итак, я хочу удалить содержимое вкладок, которые скрыты (не активны)

Пожалуйста помоги..

Answer 1

Вы можете использовать activate событие в плагине, чтобы очистить содержимое предыдущей вкладки. Попробуй это:

$('#tabs').tabs({ 
    activate: function(event, ui) {
        ui.oldPanel.empty(); // clear the content of the previous tab
    }
    // other settings, if needed...
});