PHP Page with JQuery Tabs

emerald007

i've a basic index.php atm, which has a menu div containing a table with self referencing url links, each link defines a different page parameter, which allows a seperate php page to be included in the lower section of the page.

<div class="span-24" id="menu">
<a href="index.php?page=a">A</a>
<a href="index.php?page=b">B</a>
<a href="index.php?page=c">C</a>
<a href="index.php?page=d">D</a>
<br/>
</div>

<!-- main content -->
<div class="span-24" id="main">
<?php 
    if(isset($_GET['page']))
    {
        $page=$_GET['page'];
        @ require_once($MYROOT."/$page.php");
    }
?>
</div>

now i want to make the menu a bit fancier and was considering using a jquery tab component to jazz up the menu - but i've hit a mentail block in how can i pass or set the required php page parameter when using jquery? im think i've been look at this too long and can't see the wood from the tree, all ideas and suggestions will be consider and appreciated.

Liam Byrne

Firstly, make the hrefs in the menu the pages themselves, not index.php?page=xxxx

<div class="span-24" id="menu">
<a href="a.php">A</a>
<a href="b.php">B</a>
<a href="c.php">C</a>
<a href="d.php">D</a>
<br/>
</div>

Then

$("#menu a").click(function() {
$("#main").load($(this).attr("href"));
return false;
})

randombar

Is there examples of that this does lads??

Liam Byrne

GaryCocs wrote: »

Is there examples of that this does lads??

Don't have one immediately to hand (brain fuzzy at this hour) but it basically loads "part of" a page into a particular DIV instead of reloading the whole page.

Oh, OP - if you do need to keep the "index.php?page=" as per the original - might be handy if you've no way of adding code to see if it's Google that referenced the page (an AJAX / jQuery equivalent of a nav "frame" loader), then you could do

$("#menu a").click(function() {
$("#main").load($(this).attr("href").split("page=")[1]+".php");
return false;
})

randombar

Ah right, gotcha, kinda like an animated version of Ajax

Liam Byrne

Ajax, yes; animated, no.

You "could" animate it, though.