0

Jquery tabs() seems loaded not entirely when it loaded from .html() function.

JSFiddle here: https://jsfiddle.net/Padlavoine/5mg7e7k3/2/

$(function() {
    var ajaxResponse = '<div id="tabsConfigAc" class="tabs-min"><ul><li href="#subTab1"> subTab1 </li><li href="#subTab2"> subTab2 </li></ul><div id="subTab1">test</div><div id="subTab1">test</div></div>';

    $( "#tabsAc" ).tabs();

    $('#ax_list').html(ajaxResponse);
    $('#tabsConfigAc').tabs();


    var ajaxResponse2 = '<div id="tabsConfigAc2" class="tabs-min"><ul><li href="#subsubTab1"> subsubTab1 </li><li href="#subsubTab2"> subsubTab2 </li></ul><div id="subsubTab1">test</div><div id="subsubTab1">test</div></div>';
    $('#tabsAc2').html(ajaxResponse2);
    $( "#tabsConfigAc2" ).tabs();
});

<div id="tabsAc">
<ul>
    <li><a href="#tab0"> Liste </a></li>
    <li><a href="#tab1"> Liste 2 </a></li>
    <li><a href="#tab2"> Liste 3 </a></li>
</ul>
<div id="tab0">
    <div id="ax_list">Content </div>
</div>
<div id="tab1">
    <div id="ax_list1">Content 1</div>
</div>
<div id="tab2">
    <div id="ax_list2">Content 2</div>
</div>
</div>
<br /><br />
<div id="tabsAc2"></div>

Same result with .refresh() function on tabs.

Do you know a different method ?

Pad
  • 95
  • 1
  • 1
  • 8
  • Your jsfiddle throws `TypeError: $(...).tabs is not a function` – phts Apr 05 '15 at 15:01
  • Jquery ui is active ? Can you see the result here: https://jsfiddle.net/Padlavoine/5mg7e7k3/2/embedded/result/ – Pad Apr 05 '15 at 15:04
  • UI is active. Same result. – phts Apr 05 '15 at 15:06
  • This is my screenshot : http://picpaste.com/pics/Capture_d_____cran_2015-04-05____17.08.18-2I3X6fLW.1428246643.png – Pad Apr 05 '15 at 15:11
  • It seems my FF blocked script loading due to an error `Blocked loading mixed active content "http://code.jquery.com/ui/1.9.2/jquery-ui.js"` – phts Apr 05 '15 at 15:53
  • Have you tried http://stackoverflow.com/questions/9503733/jquery-tabs-within-tabs-not-showing-correctly or http://stackoverflow.com/questions/24797405/jquery-tabs-inside-of-tabs or http://stackoverflow.com/questions/15251524/how-to-use-jquery-ui-tabs-inside-one-jquery-ui-tab ? – phts Apr 05 '15 at 15:59
  • All examples work well, it's only when I use .html() to put content. All my content come from Ajax request, It's same problem with .append()... – Pad Apr 06 '15 at 08:18

0 Answers0