Question

I have following two tables and a script having a function includePage(). Table with id=1 contains a menu whereas table with id2 is empty. It just contain one cell.

Now I want that when a user click on the first option in the menu of table having id=1, a dummypage1.html may appear in the table having id=2. Similarly when a click is on the second option of menu of table having id=1, a dummypage2.html may appear in the table having id=2.

How exactly can I tell the browser with the help of script to include the pages in table having id=2? Please help.

<table id="1">
 <tr>
    <td id="choice1" onclick="loadPage()">Initialize Session</td></tr>
    <td id="choice2" onclick="loadPage()">Sessions Information</td></tr>  
 </tr>
</table>

---

<table id="2">
    
</table>

---

<script language="javascript">
            
    function loadPage(){
        //if (document.getElementById('choice1')
        //      {
        //          <iframe src="sessionInformationTable.html" width="727px" height="416px"></iframe>
        //      }
    }
      
    </script>

Answer 1

You can pass a parameter on loadPage function

<td id="choice1" onclick="loadPage(1)">Initialize Session</td></tr>
<td id="choice2" onclick="loadPage(2)">Sessions Information</td></tr>  

<table id="2">
    <tr><td id="TD"></td></tr>
</table>
 <script>
   function loadPage(whatPage) {
        var url = (whatPage==1) ? "initSession.html" : "infoSession.html";
        document.getElementById('TD').innerHTML = '<iframe src="'+url+'" width="727px" height="416px"></iframe>';
   }
</script>  

OR

<table id="2"><tr><td><iframe src="about:blank" id="content" style='width:100%;height:100%;"/></td></tr></table>  

then on the javascript:

function loadPage(whatPage) {
   document.getElementById('content').src =  (whatPage==1) ? "initSession.html" :   "infoSession.html";
 }