使用PHP / Ajax更改选项卡（和URL）

Question

I'm not really sure what the correct term is for this, but I guess it's tabbed URLs or something similar. Anyway, I see it a lot on the web and I'm tying to figure out how the effect is aheived.

A good example are the tabs found when editing your Github profile at https://github.com/settings/profile

Let's say we have menu with some tabs:

<ul>
<li><a href="tab1">tab1</a></li>
<li><a href="tab2">tab2</a></li>
<li><a href="tab3">tab3</a></li>
</ul>

and then a content div:

<div class="tab-content">

</div>

From what I can see, when the respective tab link is clicked, an ajax request is sent out to fetch the data which then gets inserted into the content area. Which is pretty much standard from what I understand.

However, the part I don't get is how when the url is loaded in a new tab or window, it goes straight to the respective tab.

For example, if you visit: https://github.com/settings/notifications you'll go straight to the notifications tab.

I'm trying to implement a similar tab setup with PHP. The ajax part isn't really an issue, I can get that working quite easily. However, getting the url to load the respective tab on a fresh request, is what I'm stuck at.

The way I was thinking of doing it is simply checking the URL and then loading the tab, like this:

<div class="tab-content">
<?php
$URL = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";

if ($URL = "http://example.com/tabs/tab1") {
    echo "this is tab1 content";
}
else if ($URL = "http://example.com/tabs/tab2") {
    echo "this is tab2 content";
}
// etc etc
?>
</div>

But if I have 20 tabs, I don't really want to put 20 if/else statements in my page. The only other way I was thinking is placing the URL values in an array, and looping through it. Is there a better way of setting up a tab system like this with PHP?

Answer 1

You can also put your data into database and then query database. But without using database you can also for example put tab content into files and do something like this:

<?php
   $URL = $_SERVER['REQUEST_URI'];

   $file = 'path_with_content' . DIRECTORY SEPARATOR . str_replace('/' , DIRECTORY_SEPARATOR, $URL).'.php';
   if (file_exists($file))  {
     echo file_get_contents($file);
  }

So you simple create directory path_with_content/tabs and for each tab you create file inside this directory with the same name as last part as last part of your url (tab1, tab2 and so on) with .php extension (so files should have names tab1.php, tab2.php and so on).

Answer 2

you can use an array such as $navigation = Array('Home' => 'index.php', 'About' => 'about.php');

then if you make an global variable like something as: $curPage

and you load the array

for each loop and then check the $curPage is looped and make it another font colour

the $curPage will be 'Home' or 'About' then show it with another font or bg colour

this I my paste about it - it's not the best one yet it is working - forgot to put out the numbering xD - http://pastebin.com/H1XcUiiE

TIP: Instead of putting it up in ever page you can create a navigation.php file and include it into the area of the navigation bar all the time.