View Full Version : Again Help Needed.

05-17-2007, 11:29 AM
hi all,
i'm fresh to javascript ,
in a web page <a> tag is present like this

<a id="a" onClick="document.getElementById('mytable').style.display = 'none';return false">hide</a>
<a onClick="document.getElementById('mytable').style.display = 'block';return true">show </a>

how to integrate these two into one
that is click in hide the text will become 'Show' and it should execute the Show functionality.

how can i achieve this...
help me plz..
urgent need.

05-17-2007, 01:51 PM
Try the following code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function showHide(obj) {
if(obj.innerHTML == 'Hide') {
document.getElementById('tab1').style.display = 'none';
obj.innerHTML = 'Show';
return false;
else {
document.getElementById('tab1').style.display = 'block';
obj.innerHTML = 'Hide';
return true;
<table cellpadding='0' cellspacing='0' width='200' border='1' id='tab1'>
<a href="javascript: void(0)" onclick="showHide(this);" >Hide</a>

I haven't entered much inside the table just for the testing entered some misc data.

05-17-2007, 02:25 PM
Please use a descriptive title. Policy is to give a warning (point infraction, which could add up to a ban), but since you're new, I'll just make this a warning.
This isn't meant to be mean, but help us and you, so we know what you're asking, can find it later, will look if we know (since we might not if it's generic), and so that others can later find this as a similar topic to what they may be interested in.

05-17-2007, 05:09 PM
document.getElementById('tab1').style.display = 'block';

As the target is a table, using the display value, block, isn't appropriate: the correct value is 'table', but IE doesn't understand this. The usual solution is to assign an empty string which allows the applicable rule from the default style sheet to be used.

<a href="javascript: void(0)" onclick="showHide(this);" >Hide</a>

To the OP: don't use links like this. In fact, as you aren't linking to anything, don't use a link at all. Use a button or some other element and style it to appear interactive.