Include page in a div using onclick

Question

I want to include some pages into a div but I don't know how. The code with the problem is below

I want to include a page in a content div, so when I click on contact in the navigationbar the contact.php needs to be loaded in the index.php's content div and when I click on about us in the navigationbar the about.php page is included into the index.php's content div..

<html>
   <body>
     <div id="navbar">
       <ul>
         <li>
            home
         </li>
         <li> 
            about us
         </li>
         <li>
            contact
         </li>
       <ul>
     <div id="content">
         <!--so when the user clicks on contact us there needs 
             to be an include in this div wich includes the contactus.php page.
         -->
         <?php include 'contactus.php'; ?>
     </div>
   </body>
</html>

Did you took a look at [jQueryUI Tabs - Content via Ajax](http://jqueryui.com/tabs/#ajax) ? — Mihai Iorga, Nov 19 '13 at 14:27
No i didn't but isn't making use of includes a better way to fill a div with content from another page? — Najib Bijan, Nov 19 '13 at 14:35
Did you try anything? This will involve the use of some AJAX functions. — qwertynl, Nov 19 '13 at 14:36
You have to use Ajax, see: http://stackoverflow.com/questions/9963799/ajax-jquery-load-webpage-content-into-a-div-on-page-load — Mario, Nov 19 '13 at 14:36

score 1 · Answer 1 · answered Nov 19 '13 at 14:37

1

Recode ul like below

 <ul>
             <li id="home">
                home
             </li>
             <li id="aboutus"> 
                about us
             </li>
             <li id="contact">
                contact
             </li>
           <ul>

   $(document).ready(function(){
  $("#home").click(function(){
    $("#content").load("home.php");
  });
});

same for contact and aboutus

answered Nov 19 '13 at 14:37

user7789076

798
2
12
25

1

This will end up being very spaghetti-like. – qwertynl Nov 19 '13 at 14:38

Include page in a div using onclick

1 Answers1

Linked