Nascondere riga a seconda del valore selezionato

**fcrisafi** · 05-04-2004, 12:31

Ciao a tutti. Vorrei fare in modo che selezionando le opzioni di una select superiori alla prima scompaia una riga della tabella.
Allora ho fatto

function nascondi()
var campoSel = document.nomeform.nomecampo.options.selectedIndex
if (campoSel > '1')
{
document.all['riga'].style.visibility = "hidden";
}

Nella riga ho scritto: <tr id="riga" style="visibility:visible">

Ma non va. Perchè?

**Mich_** · 05-04-2004, 15:13

Non conosco la sintassi IE, ti propongo quella del W3C:

function nascondi()
var campoSel = document.nomeform.nomecampo.selectedIndex;
if (campoSel > '1')
{
document.getElementsById('riga').style.visibility = "hidden";
}

(ho tolto un'option; ho messo un get... al posto di all e le tonde al posto delle quadre)

Nota: questo vale per il tag <tr>, non e` detto che valga per i tag eventualmente contenuti (es. <td> ).
Tutti gli oggetti contenuti dovrebbero avere visibility:inherit; perche` la cosa funzioni

**Xinod** · 05-04-2004, 18:53

temo che per il w3c la questione non sia da risolvere in questo modo,
qui approfondimento del comportamento inatteso

**Mich_** · 06-04-2004, 10:33

Xinod, due domande.

1. hai notato che qui si parla di visibility, nell'altro thread si parlava di display. Pensi che Mozilla si comporti allo stesso modo? - La visibility non dovrebbe modificare la geometria della pag., mentre il display si`, per cui mi aspetto che non sia proprio lo stesso.

2. nell'altro thread, se ho ben capito, hai scritto che mozilla si comporta in maniera errata, mentre IE ed Opera sono corretti. Quindi e` un bug di mozilla! O sbaglio? E non potrebbe esserci in giro una patch?

Grazie

**fcrisafi** · 06-04-2004, 11:15

Comunque ho risolto con successo così:

function nascondi() {
var campoSel = document.nomeform.nomecampo.options.selectedIndex
if (campoSel > '0')
{
document.all['riga'].style.display = "none";
}
else
{
document.all['riga'].style.display = "block";
}
}

Mancavano un paio di parentesi {}

**Xinod** · 06-04-2004, 13:58

Originariamente inviato da Mich_
Xinod, due domande.

1. hai notato che qui si parla di visibility, nell'altro thread si parlava di display. Pensi che Mozilla si comporti allo stesso modo? - La visibility non dovrebbe modificare la geometria della pag., mentre il display si`, per cui mi aspetto che non sia proprio lo stesso.

ops, sì, cambi di visibilità non creano problemi

2. nell'altro thread, se ho ben capito, hai scritto che mozilla si comporta in maniera errata, mentre IE ed Opera sono corretti. Quindi e` un bug di mozilla! O sbaglio? E non potrebbe esserci in giro una patch?

trai bug di moz non ho trovato riferimenti a situazioni analoghe
(ho ricercato a suo tempo, riproverò appena un po' + libero)

**Xinod** · 07-04-2004, 00:17

mozilla si aspetta valori validi per la proprietà display, che x i css2 nel caso di tabelle o elementi di tabelle sono

TABLE { display: table }
TR { display: table-row }
THEAD { display: table-header-group }
TBODY { display: table-row-group }
TFOOT { display: table-footer-group }
COL { display: table-column }
COLGROUP { display: table-column-group }
TD, TH { display: table-cell }
CAPTION { display: table-caption }

un esempio (testato con IE6, Moz1.5, Opera7 su win2k)

codice:

<html>
<head>
<title>mostra/nascondi righe tabella</title>
<style type="text/css">
tr {display:table-row}
</style>
<script type="text/javascript">
function mostra_nascondi(id_riga){
	var IE=(window.navigator.userAgent.indexOf('MSIE')>-1)?1:0;
	document.getElementById(id_riga).style.display=(document.getElementById(id_riga).style.display=='none')?((IE)?'block':'table-row'):'none';
}
</script>
</head>
<body>
<table>
  <tbody>
    <tr id="riga1">
      <td>c1</td>
      <td>c2</td>
    </tr>
    <tr id="riga2">
      <td>c3</td>
      <td>c4</td>
    </tr>
   </tbody>
</table>
mostra_nascondi('riga1')

mostra_nascondi('riga2')
</body>
</html>

**emanueledg** · 17-12-2005, 14:27

Ok, informazione utilissima.
Nel caso in cui ad un solo click si debbano nascondere più righe, anziché ripetere la funzione nel link

codice:

<A href="#" onClick="mostra_nascondi('riga1');
mostra_nascondi('riga2');
mostra_nascondi('riga3'); return false">

si potrebbe usare il metodo document.getElementsByClass('classname') associando la stessa classe agli elementi interessati?

**Liam81** · 22-02-2006, 18:58

Riguardo a questro 3D, avrei alcune domande:
1: come faccio a partire con le righe già nascoste?
2: quale codice devo scrivere se dovessi inserire 2 link (esempio + e -) che premendo il + mi visualizzi tutte le righe, mentre il meno me le nasconda??
Ciao a tutti

Discussione: Nascondere riga a seconda del valore selezionato

Strumenti discussione

Ricerca discussione

Visualizza

Nascondere riga a seconda del valore selezionato

risolto

Funzione su righe multiple

Permessi di invio