Script per visualizzare/nascondere dati con checkbox

**stewe19** · 22-09-2008, 10:51

Ciao a tutti!

Sto cercando uno script che mi permetta di visualizzare o nascondere un tr di una tabella tramite una checkbox..
dove lo poso reperire?

**dav22** · 22-09-2008, 11:06

Secondo me puoi usare la proprietà display dei CSS.

Ti allego un esempio - spero esserti utile - di una pulsantiera (mancano le immagini mettine alcune a caso o se vuoi nel caso ti mando una email con lo zip completo ma non credo che ti serva),

ciao.

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>
<title>Pulsantiera verticale</title>
<script type="text/javascript">

function show(id1){

if(document.getElementById){

    el1=document.getElementById(id1);
    el1.style.display="block";
    }
}

function hide(id1){

if(document.getElementById){

    el1=document.getElementById(id1);
    el1.style.display="none";
    }
}

function ShowAndHide(id1,id2){

if(document.getElementById){

    el1=document.getElementById(id1);
    el2=document.getElementById(id2);

    if(el1.style.display=="none"){

        el1.style.display="block";
        el2.style.display="none";
        }

    else{

        el1.style.display="none";
        el2.style.display="block";
        }
    }
}

</script>
</head>

<body>

<h2>Pulsantiera verticale</h2>


<font size="2">Utilizza javascript per definire i metodi per nascondere / mostrare 
e il DOM livello 1 in particolare usando il metodo document.getElementById e modificando 
la proprietà Element.style.display. 

Il primo livello del DOM è quello di aprtenza definito da W3C, attualmente è presente 
il livello 3. 

Prima del livello 1 bisogna utilizzare per ogni tipo di browser i propri metodi 
e una gestione particoalre degli eventi e del documento. </font></p>
<hr>

<div bgcolor="#990033" color="#000000" id="menu1">
	
	<table cellspacing="0" cellpadding="0" width="212" border="0">
		<tr bgcolor="#006699">
			<td colspan="3" height="24" bgcolor="#00639C" align="left">
			<a style="text-decoration: none" color="#eff5fa" bgcolor="#990033" href="#" onclick="ShowAndHide('menu1','folder1');return(false)">
			[img]down.png[/img]<font color="#FFFFFF">
			Materiali</font></a></td>
		</tr>
	</table>
	<font color="#FFFFFF">
	</font></div>
<div bgcolor="#990033" color="#000000" id="folder1">
	<font color="#FFFFFF">
	</font>
	<table cellspacing="0" cellpadding="0" width="212" border="0">
		<tr bgcolor="#006699">
			<td colspan="3" height="24" bgcolor="#00639C" align="left">
			<font color="#FFFFFF">
			<a style="text-decoration: none" bgcolor="#990033" href="#" onclick="ShowAndHide('menu1','folder1');return(false)">
			[img]up.png[/img]<font color="#FFFFFF"> 
			Materiali</font></a></font></td>
		</tr>
		<tr>
			<td width="2" bgcolor="#00639C">
			[img]../img/pixt.gif[/img]</td>
			<td width="208" bgcolor="#eff5fa">
			<table cellspacing="5" cellpadding="0" width="90%" border="0" style="border-collapse: collapse" bordercolor="#111111">
				<tr>
					<td><a style="text-decoration: none" href="#">
					[img]entratastab.gif[/img]<font color="#000000"> 
					Entrata</font></a>

					<a style="text-decoration: none" href="#">
					[img]export.gif[/img]<font color="#000000"> Esportazione 
					dati</font></a>

					<a style="text-decoration: none" href="#">
					[img]extmat.gif[/img]<font color="#000000"> Uscita 
					materiale</font></a>

					<a style="text-decoration: none" href="#">
					[img]entmat.gif[/img]<font color="#000000"> Entrata 
					materiale</font></a> </td>
				</tr>
			</table>
			</td>
			<td width="2" bgcolor="#00639C">
			[img]../img/pixt.gif[/img]</td>
		</tr>
		<tr>
			<td bgcolor="#00639C" colspan="3">
			[img]../img/pixt.gif[/img]</td>
		</tr>
	</table>
	</div>


</div>
</body>
</html>

**stewe19** · 22-09-2008, 11:10

ok grazie ora lo provo!poi ti faccio sapere!

**stewe19** · 22-09-2008, 11:34

ho provato ma non riesco a riadattarlo alla checkbox..ho provato a dargli l'onchancge a non funziona!

**dav22** · 22-09-2008, 11:47

scusa ma il metodo onchange sulal checkbox è standard? perchè dalla documentazione w3c trovo solo click

http://www.w3schools.com/htmldom/dom_obj_checkbox.asp

ho provato a modificare il codice esempio ecco prova con questo..

in pratica ho aggiunto queste righe alla fine (tra il /div e il /body)

<input type="checkbox" onclick="ShowAndHide('menu1','folder1');return(fal se)" name="html" value="premimi"/> premimi

ciao

**stewe19** · 22-09-2008, 12:28

ok fuzniona!
sono riuscito a riadattarlo!
grazie mille!
Ciao!

Discussione: Script per visualizzare/nascondere dati con checkbox

Strumenti discussione

Ricerca discussione

Visualizza

Script per visualizzare/nascondere dati con checkbox

Permessi di invio