Selected e Option, mostra <input> se selezionato.

**JK93h** · 21-08-2011, 18:16

Salve, avrei bisogno di un piccolo aiuto. Non conoscendo javascript, vorrei chiedervi come fare a mostrare degli "<input ...>" se è selezionata un <option>...</option>, in base a quello che seleziono si mostrano dei campi <input ...>. Sto cercando dappertutto... ma niente. Qualcuno saprebbe aiutarmi?

vedendo da qualche parte (ma che non funziona) ho provato a scrivere un codice:

codice:

<html>

<head>
<title>Nuova pagina 1</title>
<script type="text/javascript">
function test(value) {
	if (value=='testo1') {
		document.getElementById('nome').hidden = true;
		document.getElementById('cognome').disabled = false;
	}
	if (value=='testo2') {
		document.getElementById('nome').disabled = false;
		document.getElementById('cognome').hidden = true;
	}
}
</script>
</head>

<body>
<select name="select" onChange="javascript:test(this.value);"> 
  <option value="">Effettua una scelta</option> 
  <option value="testo1">testo1</option> 
  <option value="testo2">testo2</option> 
</select>

<input type="text" name="nome" id="nome">

<input type="text" name="cognome" id="cognome">
</body>

</html>

**Xinod** · 21-08-2011, 18:59

se vuoi solo nascondere (rendere non visibile) un elemento
document.getElementById('nome').style.visibility=' hidden'; // ='visible' per mostrarlo

se vuoi che venga nascosto e allo stesso tempo rimosso lo spazio precedentemente occupato
document.getElementById('nome').style.display='non e'; // ='block' (o 'inline' se e' di tipo inline) per mostrarlo

va da se' che, se vuoi che l' option selezionata determini quali campi rendere invisibili/visibili, devi operare in entrambi i casi su entrambi gli elementi

ciao

**JK93h** · 21-08-2011, 19:04

Originariamente inviato da Xinod
se vuoi solo nascondere (rendere non visibile) un elemento
document.getElementById('nome').style.visibility=' hidden'; // ='visible' per mostrarlo

se vuoi che venga nascosto e allo stesso tempo rimosso lo spazio precedentemente occupato
document.getElementById('nome').style.display='non e'; // ='block' (o 'inline' se e' di tipo inline) per mostrarlo

ciao

Ti ringrazio per avermi risposto, però io pensandoci un pò ho provato con un codice che ho visto in una discussione e mi funziona però ho un solo problema, prima dell'<input ...> io ho un testo tipo Nome: dato che quel codice javascript funziona solo sull'input come potrei nascondere insieme all'input anche il testo?
Io ho per esempio:

codice:

Nome: INPUT
Cognome: INPUT
Data: INPUT

io selezionando per esempio l'option Nome mi deve visualizzare solo Nome: INPUT e gli altri due no mentre se seleziono l'option Cognome mi deve visualizzare solo Cognome: INPUT.
A me funziona nascondendo solo il campo input e non il testo. Spero di esser stato chiaro.

**cavicchiandrea** · 21-08-2011, 19:35

racchiudi tutto in un div gli dai un id e ti ferisci a quello
<div id="camponome"><div>testo</div><div>INPUT</div></div>
document.getElementById("camponome").style.display ='none'//nasconde

P.S. Il div contenitori testo e input dovrai formattarli con i css x affiancarli

**JK93h** · 21-08-2011, 19:54

Originariamente inviato da cavicchiandrea
racchiudi tutto in un div gli dai un id e ti ferisci a quello
<div id="camponome"><div>testo</div><div>INPUT</div></div>
document.getElementById("camponome").style.display ='none'//nasconde

P.S. Il div contenitori testo e input dovrai formattarli con i css x affiancarli

Ho provato a fare come hai detto tu, con il testo funziona ora ma non mi visualizza l'input

codice:

<div id='pdc'>Pannello di controllo:</div><div><input id='pdc' type='text' name='pdc' size='20' hidden></div>

ma percaso con questo codice javascript qui (per nascondere o rendere visibile) vabbene lo stesso?

codice:

document.getElementById('pdc').hidden = true; // (o false)

Discussione: Selected e Option, mostra <input> se selezionato.

Strumenti discussione

Ricerca discussione

Visualizza

Selected e Option, mostra <input> se selezionato.

Permessi di invio