Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery UI - Tabs reacting weired

I'm having a wierd problem with jquery ui tabs.

here's the code:

  <div class="ym-gbox">
    <script>
    $(function() {
        $( "#tabs" ).tabs();
    });
    </script>
            <h1>Versions Übersicht</h1>
    <br />
    <div id="tabs">
        <ul>
            <li><a href="#tabs-1">System Kern</a></li>
            <li><a href="#tabs-2">Anwendungen</a></li>
            <li><a href="#tabs-3">Bibliotheken</a></li>
        </ul>
        <div id="tabs-1">
            <table width="100%" border="0" cellpadding="0" cellspacing="0" class="bordertable">
<tr><th>Name</th><td>System Kern</td></tr>
<tr><th>Version</th><td>1.0.0 </td></tr>
<tr><th>Beschreibung</th><td></td></tr><tr><td colspan="2">System Kern</td></tr>
<tr><th>Webseite</th><td>http://www.dsws.biz</td></tr>
<tr><th>Lizenz</th><td>Dark Star Web Services Source Lizenz</td></tr>
<tr><th>Autor</th><td>
</td></tr>
</table>
        </div>
        <div id="tabs-2">
            b
        </div>
        <div id="tabs-3">
            c
        </div>
    </div>
  </div>

As soon as the page loads, the complete page is loaded into the tab tabs. I don't really have a clue why this happens.

like image 886
Chris West Avatar asked Dec 26 '22 12:12

Chris West


1 Answers

For me this exact problem was related to the base tag and couldn't be solved by click event Chris idea refers to. It may also occur if your urls are being rewritten to have the full absolute url, e.g. by a caching tool or .htaccess

So if your tabs were being rewritten as <a href="http://example.com/page/#tab1">tabname</a>

Then a solution is to remove the full url before initializing the tabs. The following (expanded to keep it simple), removes everything leading up to the #

jQuery("#mytabs ul li a").each(function () {
    var current = jQuery(this).attr("href");
    var n = current.indexOf("#");
    jQuery(this).attr("href", current.substr(n));
});

jQuery("#mytabs").tabs( .. )
like image 122
eagle779 Avatar answered Jan 12 '23 02:01

eagle779