In the following code all of the tabs initially display their proper text (Home,Reports,Setup,Documentation,Support). When any of the ajax tabs are clicked (Home, Documentation, Support) the text on the tab changes to "Loading...". However, the 2 non ajax tabs (Reports and Setup) keep their text. How do I keep it from going to "Loading..." Why would this change?
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {
$("#tabs").tabs();
});
</script>
</head>
<script>
$(document).ready(function() {
$("#tabs").tabs({ ajaxOptions: {cache: false}});
}
</script>
<html>
<div id="tabs">
<div id="menu">
<ul>
<li><a href="home.php" title=Home><span>Home</span></a></li>
<li><a href="#report_tabs" title=Reports><span>Reports</span></a></li>
<li><a href="#setup_tabs" title=Setup><span>Setup</span></a></li>
<li><a href="documentation.php" title=Documentation><span>Documentation</span></a></li>
<li><a href="support.php" title=Support><span>Support</span></a></li>
</ul>
</div>
</div>
</html>