List of links inside a tab
I've run into a snag with the UI tabs plugin. I have a page several
lists of links. Each list contains links that are related. For
example the users list links to pages for creating new users, editing
users, setting permissions, etc. Same thing for a groups list (new
group, edit group, etc)
I thought I could put each list in a tab for convenience, but I ran
into a problem. Whenever I click a link to a page when the list it is
in is wrapped with a UI tab, the page doesn't load as it would
normally, but loads into the tab itself!
I think that the tab plugin is picking up lists inside the items to be
tabbed and treating them like tab links (if that makes sense)
My HTML is formatted like this:
<div class="tabber">
<ul class="nav" id="formTabs">
<li><a href="#div1">Manage users</a></li>
<li><a href="#div2">Manage groups</a></li>
</ul>
<div class="tabbertab" id="div1">
<h2>Manage users</h2>
<div class="fieldGroup">
<ul>
<li>Register a new user</li>
<li>List all users</li>
<li>List provisional users</li>
<li>Search for a user</li>
</ul>
</div>
</div>
<div class="tabbertab" id="div2">
<h2>Manage groups</h2>
<div class="fieldGroup">
<ul>
<li><a href="newgroup.php">Create a new group</a></li>
<li>List groups</li>
</ul>
</div>
</div>
</div>
I'm just doing $('.tabber').tabs () to enable tabbing.