Member Avatar for pachoate

Hi,

I am trying to hide tables when a page initially loads and only display them when a button is pressed. When the page loads the tables show and I need then to be hidden. What am I doing wrong? I am new to this.

Here is the code that I have so far.

<Script = text/javascript>

function show_hide(tblid, show) {
if (tbl = document.getElementById(tblid)) {
if (null == show) show = tbl.style.display == 'none';
tbl.style.display = (show ? '' : 'none');
}
}

function initHiddenTable(tableId){
	var tbl = document.getElementById(tableId);
	if(tbl) {
		//1. Generate +/- control
		var a = document.createElement('a');
		a.setAttribute('href', '');
		a.onclick = function(){
			show_hide(tableId);
			return false;
		}
		var txt = document.createtextNode('+/-');
		a.appendChild(txt);
		tbl.parentNode.insertBefore(a, tbl);
		//2. Hide Table
		if(tbl) { tbl.style.display = 'none'; }
	}
}

onload = function hide(){
	var hideTables = ["exampletbl", "exampletbl2"];
	for(var i=0; i<hideTables.length; i++){
		initHiddenTable(hideTables[i]);
	}
}
</script>

<form>
<form onload="hide('exampletbl'); hide('exampletbl2');">

<body>
<table>

<td><input type="button" Name="Tagsearch" Value="Block 8" onclick="show_hide('exampletbl')" /><td>
<td><input type="button" Name="Tagsearch" Value="Block 9" onclick="show_hide('exampletbl2')" /><td>
</table>


<div style="margin-top:12px;">
<table id="exampletbl">
<tbody>
<tr><td>row 1</td></tr>
<tr><td>row 2</td></tr>
</tbody>
</table>
</div>

<div style="margin-top:12px;">
<table id="exampletbl2">
<tbody>
<tr><td>row 3</td></tr>
<tr><td>row 4</td></tr>
</tbody>
</table>
</div>

</body>
</form>

Any help would be appreciated.

Thanks,

Paul

  • 2 Contributors
  • 1 Reply
  • 1K Views
  • 7 Hours Discussion Span
  • Latest Post Latest Post by webass
Member Avatar for webass

display them when a button is pressed

you do something like this:

<input type="button" value="clickMe" onclick="document.getElementById('111').style.display='inline'" />

and the table:

<table id="111" style="display:none">
Edited by webass because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.