Campi checkbox in un form

**viki1967** · 13-07-2006, 13:46

Ciao a tutti.

Ho questo form:

codice:

<HTML>
<HEAD>

<script language="JavaScript" type="text/JavaScript">
<!--

function disabilita(Qform)
{
var valore = Qform.AttC.options.selectedIndex;

  if(valore!=1){
    Qform.AttC.disabled = true;
  }
  else {
    Qform.AttNC.disabled = false;
  }
}

function convalidaForm(Qform) 
{

  for (var a = 0; a < Qform.elements.length; a++) 
	{
	var campo = Qform.elements[a];

      	if (campo.value.length <= 0)
      	
		{
        	window.alert('Il campo "'+ campo.name +'"\nè un campo obbligatorio in questo form.');
        	campo.focus();
        	return false;
      		}
      		    
      		    }
      		    
      		    
// Abilita l'invio del FORM
return(true);
}
 
//-->
</script>
</HEAD>

<body> 

<form action="altrapag.asp" method="post" onsubmit="return(convalidaForm(this));">

<--!altri campi del form -->

Lista:   <input type="checkbox" name="lista" value="Si">
Forfait: <input type="checkbox" name="forfait" value="Si">

<select size="1" name="AttC" OnChange="disabilita(this.form);"> ... </select>
<textarea name="AttNC" rows="5" cols="32">Nessuna</textarea>

</form>

</body>
</html>

nel quale:

1) La funzione disabilita fa in modo che se nella select AttC viene selezionato un valore si disabilita la textarea AttNC, mentre se non si seleziona nulla abilita la textarea AttNC alla compilazione;

2) La funzione convalidaForm controlla l'obbligatorietà di tutti i campi del form.

Problemi:

1) Dovrei rendere inizialmente obbligatori anche i checkbox Lista e Forfait e fare in modo che se si mette il flag in uno dei due checkbox l'altro venga disabilitato alla compilazione (dunque non più obbligatorio);

2) Quando viene abilitata alla compilazione textarea AttNC il valore iniziale "Nessuna" dà via libera al form, mentre in questo caso dovrebbe essere richeista la compilazione con testo diverso da "Nessuna".

Spero d'essermi spiegato, non è facile.

Confido nel vs. prezioso aiuto, saluti
Viki1967

**viki1967** · 14-07-2006, 14:46

up

**cavicchiandrea** · 14-07-2006, 18:48

ho risistemato il form utilizzando il dom, spero daver capito e che cosi vada bene.

codice:

<HTML>
<HEAD>

<script language="JavaScript">
function convalidaForm(){

if(!document.getElementById('lista').checked && !document.getElementById('forfait').checked){
alert("Devi selezionare una opzione");
document.getElementById('errore').innerHTML='*';
return false;
}
if(!document.getElementById('AttNC').disabled){
if(document.getElementById('AttNC').value == 'Nessuna' || document.getElementById('AttNC').value == ''){
alert("Devi devi inserire una.....");
document.getElementById('AttNC').focus();
return false;
}
}
}
</script>
</HEAD>

<body> 

<form name="MyForm" action="altrapag.asp" method="post" onsubmit="return convalidaForm();">
<span id="errore"></span>
Lista:   <input type="checkbox"  id="lista" name="lista" value="Si" onClick="if(this.checked){document.getElementById('forfait').disabled=true;document.getElementById('forfait').checked=false}else{document.getElementById('forfait').disabled=false}">
Forfait: <input type="checkbox" id="forfait" name="forfait" value="Si" onClick="if(this.checked){document.getElementById('lista').disabled=true;document.getElementById('lista').checked=false}else{document.getElementById('lista').disabled=false}">

<select size="1" id="AttC" name="AttC" onChange="if(this.options.selectedIndex != 0){document.getElementById('AttNC').disabled=true;document.getElementById('AttNC').value='';}else{document.getElementById('AttNC').disabled=false;document.getElementById('AttNC').value='Nessuna'}">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
   ... 
</select>
<textarea name="AttNC" cols="32" rows="5" id="AttNC" onFocus="if(this.value=='Nessuna')this.value=''" onBlur="if(this.value=='')this.value=defaultValue">Nessuna</textarea>
<input type="submit" name="Submit" value="Submit">
</form>

</body>
</html>

**viki1967** · 14-07-2006, 19:52

Grazie Andrea per il prezioso aiuto.

Adesso il form funziona come avevo in mente

; solo una domanda:

- Per gli altri campi del form (quelli che inizialmente controllavo con la vecchia function convalidaForm) quale controllo devo prevedere ???

Grazie 1000, ciao
Viki1967

**cavicchiandrea** · 14-07-2006, 20:27

Originariamente inviato da viki1967
Grazie Andrea per il prezioso aiuto.

Adesso il form funziona come avevo in mente

; solo una domanda:

- Per gli altri campi del form (quelli che inizialmente controllavo con la vecchia function convalidaForm) quale controllo devo prevedere ???

Grazie 1000, ciao
Viki1967

Dallo script postato la function verificava solo la texarea non avevo capito che nel form vi erano altri campi da verificare per questo mi sono permesso di modificarla con l'attuale.
Comunque posta i campi che mancano (sperando che non siano 30 controlli) che la integro.
Per la prossima volta e buona norma postare tutta la pagina cosi uno non "lavora" due volte, in + sia fa subito un idea del tempo che impiegherebbe per sviluppare lo script, e solo un consiglio senza polemica.

**viki1967** · 14-07-2006, 20:41

Originariamente inviato da cavicchiandrea
Per la prossima volta e buona norma postare tutta la pagina cosi uno non "lavora" due volte, in + sia fa subito un idea del tempo che impiegherebbe per sviluppare lo script, e solo un consiglio senza polemica.

Si scusa è stato una mia leggerezza... cmq non sono 30 campi sono solo 5

e devono essere tutti obbligatori, eccoli:

codice:

  <select size="1" name="uoat">
  <option value="rm">rm</option>
  <option value="cb">cb</option>
  <option value="lt">lt</option>
  <option value="vt">vt</option>
  <option value="pe">pe</option>
  <option value="aq">aq</option>
  </select>
  
  <input type="text" name="data_inizio" size="20">
  <input type="text" name="data_fine" size="20">
  
  <select size="4" name="nomi" multiple>
  <option value="pippo">pippo</option>
  <option value="tizio">tizio</option>
  <option value="caio">caio</option>
  <option value="sempronio">sempronio</option>
  </select>
  
  <textarea rows="2" name="annotazioni" cols="20">Nessuna</textarea>

**cavicchiandrea** · 14-07-2006, 21:56

due dubbi le due select va aggiunto un option "seleziona" altrimenti la prima voce sarebbe non selezionabile?
I campi data inizio/fine devono verificare solo che siamo compilati non che sia una data valida (sarebbe un lavoraccio al quale ora non potrei dedicarmi)!

**viki1967** · 15-07-2006, 10:49

Originariamente inviato da cavicchiandrea
due dubbi le due select va aggiunto un option "seleziona" altrimenti la prima voce sarebbe non selezionabile?

Si esatto mi è sfuggito nel copia/incolla:

codice:

<select size="1" name="uoat">
  <option>Seleziona uoat</option>
  <option value="rm">rm</option>
  <option value="cb">cb</option>
  <option value="lt">lt</option>
  <option value="vt">vt</option>
  <option value="pe">pe</option>
  <option value="aq">aq</option>
  </select>
  
  <input type="text" name="data_inizio" size="20">
  <input type="text" name="data_fine" size="20">
  
  <select size="4" name="nomi" multiple>
  <option>Seleziona nome</option>
  <option value="pippo">pippo</option>
  <option value="tizio">tizio</option>
  <option value="caio">caio</option>
  <option value="sempronio">sempronio</option>
  </select>
  
  <textarea rows="2" name="annotazioni" cols="20">Nessuna</textarea>

I campi data inizio/fine devono verificare solo che siamo compilati non che sia una data valida (sarebbe un lavoraccio al quale ora non potrei dedicarmi)!

Si verificare soltanto che il campo sia compilato, la verifica della validità la faccio poi lato server con asp.

Grazie.

**cavicchiandrea** · 15-07-2006, 11:16

codice:

<HTML>
<HEAD>

<script language="JavaScript">
function convalidaForm(){

if(!document.getElementById('lista').checked && !document.getElementById('forfait').checked){
alert("Devi selezionare una opzione");
document.getElementById('errore').innerHTML='*';
return false;
}
if(!document.getElementById('AttNC').disabled){
if(document.getElementById('AttNC').value == 'Nessuna' || document.getElementById('AttNC').value == ''){
alert("Devi devi inserire una.....");
document.getElementById('AttNC').focus();
return false;
}
}
if(document.getElementById('uoat').options.selectedIndex == 0 ){
alert("Seleziona una voce uoat");
document.getElementById('uoat').focus();
return false;
}
if(document.getElementById('data_inizio').value == "" ){
alert("Inserisci una data inizio");
document.getElementById('data_inizio').focus();
return false;
}
if(document.getElementById('data_fine').value == "" ){
alert("Inserisci una data fine");
document.getElementById('data_fine').focus();
return false;
}
if(document.getElementById('nomi').options.selectedIndex == 0 ){
alert("Seleziona un nome dalla lista");
document.getElementById('nomi').focus();
return false;
}
if(document.getElementById('annotazioni').value == 'Nessuna' || document.getElementById('annotazioni').value == ''){
alert("Devi devi inserire una.....");
document.getElementById('annotazioni').focus();
return false;
}

}
</script>
</HEAD>

<body> 

<form name="MyForm" action="altrapag.asp" method="post" onsubmit="return convalidaForm();">
<span id="errore"></span>
Lista:   <input type="checkbox"  id="lista" name="lista" value="Si" onClick="if(this.checked){document.getElementById('forfait').disabled=true;document.getElementById('forfait').checked=false}else{document.getElementById('forfait').disabled=false}">
Forfait: <input type="checkbox" id="forfait" name="forfait" value="Si" onClick="if(this.checked){document.getElementById('lista').disabled=true;document.getElementById('lista').checked=false}else{document.getElementById('lista').disabled=false}">

<select size="1" id="AttC" name="AttC" onChange="if(this.options.selectedIndex != 0){document.getElementById('AttNC').disabled=true;document.getElementById('AttNC').value='';}else{document.getElementById('AttNC').disabled=false;document.getElementById('AttNC').value='Nessuna'}">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
   ... 
</select>
<textarea name="AttNC" cols="32" rows="5" id="AttNC" onFocus="if(this.value=='Nessuna')this.value=''" onBlur="if(this.value=='')this.value=defaultValue">Nessuna</textarea>
<select size="1" name="uoat" id="uoat">
  <option selected>Seleziona uoat</option>
  <option value="rm">rm</option>
  <option value="cb">cb</option>
  <option value="lt">lt</option>
  <option value="vt">vt</option>
  <option value="pe">pe</option>
  <option value="aq">aq</option>
  </select>
  
  <input type="text" name="data_inizio" id="data_inizio" size="20">
  <input type="text" name="data_fine" id="data_fine" size="20">
  
  <select size="4" name="nomi" id="nomi" multiple>
  <option selected>Seleziona nome</option>
  <option value="pippo">pippo</option>
  <option value="tizio">tizio</option>
  <option value="caio">caio</option>
  <option value="sempronio">sempronio</option>
  </select>
  
  <textarea rows="2" name="annotazioni" id="annotazioni" cols="20" onFocus="if(this.value=='Nessuna')this.value=''" onBlur="if(this.value=='')this.value=defaultValue" >Nessuna</textarea>
  <input type="submit" name="Submit" value="Submit">
</form>

</body>
</html>

**viki1967** · 15-07-2006, 11:19

Mitico, 1000 grazie.

Discussione: Campi checkbox in un form

Strumenti discussione

Ricerca discussione

Visualizza

Campi checkbox in un form

Permessi di invio