Re: jQuery UI - Tab Issues
Hmm, just tried it myself and had no problems. Could you post your markup perhaps?
Re: jQuery UI - Tab Issues
Sure. You can see the test page here.
Re: jQuery UI - Tab Issues
This is a guess, but it may be problematic that you're loading the home page into the first tab on the home page. As a result, after it loads, there are two elements with id="tab-bar", and the loaded-in home page will run your jQuery again and mess things up.
Try using very simple pages for the tab links (like just "<p>Hello World</p>") to test things out.
Re: jQuery UI - Tab Issues
You could have a point there but I was hoping to have the "home" page displayed first. Hmm. I'll have to figure out how to do that another way since that seems to have solved it. Thanks for the tip.
Do you know of a way to make it so that none of the tabs load their content automatically?
Cheers.
Re: jQuery UI - Tab Issues
I'm not really familiar with this plugin, so I don't know how to stop the auto-loading, but it may be more beneficial to work around it instead...
I've found that this is actually a frequent "problem" when using AJAX - needing pages to load in one way when requested directly, and in another way when requested via AJAX. I don't know if this is the best approach, but I deal with it by setting up my AJAX-loaded pages like this:
Code:
<?php
//include any globally necessary files
require_once("global-file.php");
//make a function that shows the page's content
function writePage(){
?>
<h1>Hello, this is my page</h1>
<p>Paragraph!</p>
<?php
}
//if the page was requested by AJAX, just spit out the content and stop here
if(isset($_GET['ajaxCall'])){
writePage();
exit;
}
//otherwise, continue with the page as normal
?>
<html>
<head>
<!-- etc. -->
<?php
//echo the content here as well, for when this page is requested normally
writePage();
?>
</body>
</html>
It may not be entirely intuitive, but it works. You'd need to append the "ajaxCall" (or whatever you want to call it) variable to your page requests, which you could do like so:
Code:
$('#tab-bar ul a').each(function(){
var newURL = $(this).attr("href") + "?ajaxCall=1";
$(this).attr("href",newURL)
});
It's important to append the variable via Javascript rather than manually adding it yourself, because you only want the variable to be there if Javascript is enabled.
Re: jQuery UI - Tab Issues
That's an interesting solution SambaNeko. I was thinking of something along those lines myself actually. I've had similar problems with AJAX in the past and found solutions like that to be invaluable.
Re: jQuery UI - Tab Issues
I'm having more issues with the jQuery UI tabs than I wanted so I think I'll do the long way around and write my own tab system.
Re: jQuery UI - Tab Issues
If you Google "jquery tabs" you can find others' implementations that may be more suitable to your needs. Or you can certainly write your own.