<A HREF=JavaScript:showPanel('tab3')> doesn't call the function

  • Thread starter Thread starter duncan
  • Start date Start date
D

duncan

As a newbie to Java I need a bit of help.

I have the line <A HREF=JavaScript:showPanel('tab3')> in the <body> of
my pages html which when the page does not call the identified
function. I have put alert statements in various places and the
ones in the called function does not appear.

The page is enbedded in a frameset.

The page itself came from the wrox book "Professional Javascript 2nd
Edition" which I want to adapt for a project I am developing.


What is the problem?

Thanks in advance


Duncan


The full code is

<%@ Page Language="vb" AutoEventWireup="false"
Codebehind="LeagueMaintenance.aspx.vb"
Inherits="CricketLeague.LeagueMaintenance"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>LeagueMaintenance</title>
<style>
<!-- #include file= "cricketleague.css" -->
div { display:none; }
</style>
<meta content="Microsoft Visual Studio.NET 7.0" name="GENERATOR">
<meta content="Visual Basic 7.0" name="CODE_LANGUAGE">
<meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">

<script language="javascript">
function clearTabs()
{
alert ("cleartabs called")
var tabs = document.getElementsByName("tabBar").cells
for (var i=0; i < tabs.length i++)
{
tabs.className = "InactiveTab"
}
var contentDivs = document.getElementById('contentArea').getElementByTagName("div")
for (var i = 0; i < contentDivs.length; i++)
{
contentDivs.style.display = "none"
}
}
function showPanel(selectedTab)
{
alert ("showPanel called")
clearTabs()
var tabE1 = document.getElementById(selectedTab)
tabE1.className = "ActiveTab"
var con = tabE1.getAttribute('connect')
document.getElementById(con).style.display = "block"
}
</script>
</HEAD>

<body>
<script language="javascript">
alert("java ran")
alert("java ran again")
</script>
<table border="0" width="100%" cellpadding="1" cellspacing="0"
align="center">
<tr id="tabBar">
<th ID="tab1" connect="details" class="InactiveTab">
<A HREF="JavaScript:showPanel('tab1')">Details</A>
</th>
<th ID="tab2" connect="search" class="InactiveTab">
<A HREF="JavaScript:showPanel('tab2')">Search</A>
</th>
<th ID="tab3" connect="help" class="InactiveTab">
<A HREF="JavaScript:showPanel('tab3')">Help</A>
</th>
</tr>
<tr id="contentArea">
<td colspan="3">
<div id="details">
<h3>Details</h3>
Some information can be displayed here
</div>
<div id="search">
<h3>Search</h3>
<form>
&nbsp;
<input type="text" name="querystring" size="30"> <input
type="submit" value="Search">
</form>
</div>
<div id="help">
<h3>help</h3>
<ol>
<li>
Click on the tab headings
<li>
Tab2 provides form to search
<li>
tab 3 is this page</li>
</ol>
</div>
</td>
</tr>
</table>
</body>
</HTML>
 
There is 1 subtle mistake in the clearTabs() function which is giving the error. In the for loop u have missed 1 ";". I guess your browser is not displaying the error message else you would have solved the mistake yourself.
To enable the browser to notify you of every javascript error on the page do the foll:
In Tools menu click on Internet Option submenu. Select the Advanced tab.
Under Browsing heading check the checkbox which says "Display a notification about every script error" and then run your page again. The browser will show u the error.

Just in case here is the code of clearTabs function:
function clearTabs()
{
alert ("cleartabs called")
var tabs = document.getElementsByName("tabBar").cells
for (var i=0; i < tabs.length; i++)
{
tabs.className = "InactiveTab"
}
var contentDivs = document.getElementById('contentArea').getElementByTagName("div")
for (var i = 0; i < contentDivs.length; i++)
{
contentDivs.style.display = "none"
}
}


--
Bharat Biyani ([email protected])
http://www.orcim.com



duncan said:
As a newbie to Java I need a bit of help.

I have the line <A HREF=JavaScript:showPanel('tab3')> in the <body> of
my pages html which when the page does not call the identified
function. I have put alert statements in various places and the
ones in the called function does not appear.

The page is enbedded in a frameset.

The page itself came from the wrox book "Professional Javascript 2nd
Edition" which I want to adapt for a project I am developing.


What is the problem?

Thanks in advance


Duncan


The full code is

<%@ Page Language="vb" AutoEventWireup="false"
Codebehind="LeagueMaintenance.aspx.vb"
Inherits="CricketLeague.LeagueMaintenance"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>LeagueMaintenance</title>
<style>
<!-- #include file= "cricketleague.css" -->
div { display:none; }
</style>
<meta content="Microsoft Visual Studio.NET 7.0" name="GENERATOR">
<meta content="Visual Basic 7.0" name="CODE_LANGUAGE">
<meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">

<script language="javascript">
function clearTabs()
{
alert ("cleartabs called")
var tabs = document.getElementsByName("tabBar").cells
for (var i=0; i < tabs.length i++)
{
tabs.className = "InactiveTab"
}
var contentDivs = document.getElementById('contentArea').getElementByTagName("div")
for (var i = 0; i < contentDivs.length; i++)
{
contentDivs.style.display = "none"
}
}
function showPanel(selectedTab)
{
alert ("showPanel called")
clearTabs()
var tabE1 = document.getElementById(selectedTab)
tabE1.className = "ActiveTab"
var con = tabE1.getAttribute('connect')
document.getElementById(con).style.display = "block"
}
</script>
</HEAD>

<body>
<script language="javascript">
alert("java ran")
alert("java ran again")
</script>
<table border="0" width="100%" cellpadding="1" cellspacing="0"
align="center">
<tr id="tabBar">
<th ID="tab1" connect="details" class="InactiveTab">
<A HREF="JavaScript:showPanel('tab1')">Details</A>
</th>
<th ID="tab2" connect="search" class="InactiveTab">
<A HREF="JavaScript:showPanel('tab2')">Search</A>
</th>
<th ID="tab3" connect="help" class="InactiveTab">
<A HREF="JavaScript:showPanel('tab3')">Help</A>
</th>
</tr>
<tr id="contentArea">
<td colspan="3">
<div id="details">
<h3>Details</h3>
Some information can be displayed here
</div>
<div id="search">
<h3>Search</h3>
<form>

<input type="text" name="querystring" size="30"> <input
type="submit" value="Search">
</form>
</div>
<div id="help">
<h3>help</h3>
<ol>
<li>
Click on the tab headings
<li>
Tab2 provides form to search
<li>
tab 3 is this page</li>
</ol>
</div>
</td>
</tr>
</table>
</body>
</HTML>
Click to expand...
 
duncan said:
As a newbie to Java I need a bit of help.
Click to expand...

A bit OT, and not to nitpick, but the code you provided is in JavaScript,
which is unrelated to Java.
 
Back
Top