[RESOLVED] jQuery Tabs, Loading Pages Inside The Panel
I did a search on this but couldnt find anything like this.
I am trying to load the pages inside the jQuery panel. I found this example which works fine http://www.coldfusionjedi.com/demos/jquerytabs/test.cfm
But when I use the code on my page it does not work. Everything looks fine, it loads the CSS and all, but when I click on a tab I get an error...
Message: Exception thrown and not caught
Line: 121
Char: 6144
Code: 0
URI: ../jquery/js/jquery-ui-1.7.2.custom.min.js
Here is my code. Can anyone see what I am doing wrong? Thanks for the help.
PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>jQuery UI Example Page</title>
<link type="text/css" href="../jquery/css/start/jquery-ui-1.7.2.custom.css" rel="stylesheet" />
<script type="text/javascript" src="../jquery/js/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="../jquery/js/jquery-ui-1.7.2.custom.min.js"></script>
<script>
$(document).ready(function() {
$("#example").tabs();
});
</script>
</head>
<body>
<div id="example">
<ul>
<li><a href="home.php"><span>Content 1</span></a></li>
<li><a href="home.php"><span>Content 2</span></a></li>
<li><a href="home.php"><span>Content 3</span></a></li>
</ul>
</div>
</body>
</html>
Re: jQuery Tabs, Loading Pages Inside The Panel
I don't see anything wrong with your code; when I try it myself, I get the same error, but when I change the jQuery version to 1.3.x, it works properly. Version 1.4.1 was released only 2 days ago - maybe this just doesn't work with the newest version yet?
Try going here and download version 1.3.2 and see if that remedies the problem.
Re: jQuery Tabs, Loading Pages Inside The Panel
Thanks a lot for the help. That was indeed the issue. Strange that the newest stable version does not support that.
One more question, if you can help.
Opening the page inside the panel seems to work fine. However, if I click on any link inside that panel it takes me out of the panel. How do I open pages from URL's inside the panel and make them stay inside the panel?
I read something about the .bind syntax, but I am not sure how to impliment it exactly.
Thanks.
Re: jQuery Tabs, Loading Pages Inside The Panel
Looks like they have an example of that on the jQuery UI site:
Code:
$('#example').tabs({
load: function(event, ui) {
$('a', ui.panel).click(function() {
$(ui.panel).load(this.href);
return false;
});
}
});
Re: jQuery Tabs, Loading Pages Inside The Panel
Thanks for the help, much appreciated.:wave:
We have given up on jQuery though...It just is not as good as we thought it could be. Looks like Yahoo's interface (YUI) is the way we are going to go.
Re: [RESOLVED] jQuery Tabs, Loading Pages Inside The Panel
I haven't tried YUI, but I love jQuery, to be quite honest, and have not yet found it lacking to any of my Javascripting needs. But, to each his own.
