I have a page, that shows a table when there is no parameter. But if a parameter is passed, it instead shows a form for editing. I’m trying to use jquery tabs here but it loads the whole page with the table into where the tabs content should be.
Html:
<div id="tabs">
<ul>
<li><a href="#tabs-1">Edit Product</a></li>
<li><a href="#tabs-2">Images</a></li>
</ul>
<div id="tabs-1">
<strong>Form goes here</strong>
</div>
<div id="tabs-2">
<strong>Edit images here</strong>
</div>
</div>
Screenshot before running $('#tabs').tabs():

Screenshot after:

The problem was in MooTools that was included by Joomla. Although I’m not using any mootools functions, it was somehow getting triggered by a “load” event from jQuery. I decided not to use tabs as I couldn’t find the solution. But I had this same problem when I was using a modal popup for images. (debugged through Network tab on developer tools and found MooTools being the culprit.) Just remove it and problem solved.