• User Newbie

    [Javascript] Validazione form non funziona con Explorer

    Ciaoa tutti ragazzi!...
    Ho un form dic ontatto che ha il controllo dei campi tramite js; funziona perfettamente con Firefox, ma purtroppo con Explorer, mi invia ugualmente la mail.
    vi posto l'ahtml del mio form:

    
    <form action="send.php" method="post" name="TheForm" id="TheForm" onSubmit="return VerificaForm()" enctype="multipart/form-data">
    <fieldset class="in">
    
    <label for="nominativo" class="req">
    <span id="NOMINATIVO" style="display:none; color:#FF0000">Campo obbligatorio!</span><br />
    <strong>* </strong>nome:
    <input name="nominativo" id="nominativo" value=" "  tabindex="1" accesskey="n"  title="Inserisci il tuo nome" onkeyPress="document.getElementById('NOMINATIVO').style.display='none'" /></label>
    
    <label for="cognome" class="req">
    <span id="COGNOME" style="display:none; color:#FF0000">Campo obbligatorio!</span><br />
    <strong>* </strong>cognome:
     <input name="cognome" id="cognome" value="" tabindex="2" accesskey="c"  title="Inserisci il tuo cognome" onkeyPress="document.getElementById('COGNOME').style.display='none'" /></label>
     <br>
    
    <label for="email" class="req"><strong>* </strong>email:
    <br />
    <span id="EMAIL" style="color:#FF0000"></span>
     <input name="email" id="email" value=""  tabindex="3" accesskey="e"  title="Inserisci il tuo indirizzo e-mail" onkeyPress="document.getElementById('EMAIL').innerHTML=''"/></label>
     
    
    <label for="sitoweb">Sito <input id="sitoweb" name="sitoweb" tabindex="3"  value="http://">
    </label>
    <br />
    <span id="OGGETTO" style="display:none; color:#FF0000">Indichi il motivo del contatto</span>
    <label for="oggetto" class="req"><strong>* </strong>Motivo del suo contatto:
    <select name="oggetto" id="oggetto" class="selectOne" value="Inserisci il motivo del contatto" tabindex="4" accesskey="w"  title="Inserisca il motivo del contatto" onkeyPress="document.getElementById('OGGETTO').style.display='none'">
    <option selected="selected">-- seleziona --</option>
    <option value="informazioni">Informazioni generiche</option>
      <option value="pubblicità">Pubblicit&agrave;</option>
      <option value="scambiolink">Scambio link</option>
      <option value="webdesign">Web Design</option>
      <option value="altro">Altro</option>
    </select></label>
    
    
    <br />
    
    <label for="messaggio" class="req"><strong>* </strong>Messaggio:
    <br />
    <span id="MESSAGGIO" style="display:none; color:#FF0000">Scriva il messaggio</span>
    <textarea name="messaggio" cols="20" rows="7" id="messaggio" tabindex="5" accesskey="m" title="Inserisci qui il tuo commento" onkeyPress="document.getElementById('MESSAGGIO').style.display='none'"></textarea>
    </label>
    </fieldset>
    <fieldset id="check">
    
    <label for="privacy" class="req">
    <span id="PRIVACY" style="display:none; color:#FF0000">Spunti per proseguire</span><br />
    <strong>* </strong>Consenso alla privacy : 
    <input type="checkbox" name="privacy" id="terms" tabindex="6" onclick="document.getElementById('PRIVACY').style.display='none'" value="si" class="boxes" />
    </label>
    </fieldset>
    <input name="submit" type="submit" id="invia" value="Invia" tabindex="7" accesskey="I"  title="Invia il tuo messaggio"/>
      
    <input name="Pulsante" type="button" id="annulla" class="inputSubmit" onclick="self.location.reload();this.form.reset(); " accesskey="r" tabindex="8" title="Cancella i campi" value="Cancella"/>
    
    <input type="hidden" name="MM_insert" value="invia_mail" />
    
    </form>
    
    

    e il javascript della validazione:

    
    function VerificaForm(){
        
    var Nominativo = document.getElementById("nominativo")
    if(Nominativo.value==""){
    document.getElementById(Nominativo.name.toUpperCase()).style.display='inline';
    Nominativo.focus();
    return false;
    }
    
    var Cognome = document.getElementById("cognome")
    if(Cognome.value==""){
    document.getElementById(Cognome.name.toUpperCase()).style.display='inline';
    Cognome.focus();
    return false;
    }
    
    var Email = document.getElementById("email")
    if(Email.value==""){
    document.getElementById(Email.name.toUpperCase()).innerHTML='La mail è obbligatoria';
    Email.focus();
    return false;
    }
    else if(!Email.value.match(/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/)){
    document.getElementById(Email.name.toUpperCase()).innerHTML='Verifichi la mail';
    Email.focus();
    return false;
    }
    
    var Oggetto = document.getElementById("oggetto")
    if(Oggetto.value==""){
    document.getElementById(Oggetto.name.toUpperCase()).style.display='inline';
    Oggetto.focus();
    return false;
    }
    
    var Messaggio = document.getElementById("messaggio")
    if(Messaggio.value==""){
    document.getElementById(Messaggio.name.toUpperCase()).style.display='inline';
    Messaggio.focus();
    return false;
    }
    
    var Privacy = document.getElementById("terms")
    if(!Privacy.checked){
    document.getElementById(Privacy.name.toUpperCase()).style.display='inline';
    Messaggio.focus();
    return false;
    }
    }
    
    

    Aggiungo anche che dovrei effettuare anche il controllo sulla select Oggetto....nel js pare la faccia ma in realtà non esegue alcun controllo (forse perchè è già selezionata la prima scelta)....

    Mi aiiutate? 😉


  • User Newbie

    nessuno? 😞


  • User

    guarda ad una lettura veloce... credo che ci sia qualche errore nel tuo codice, ho scritto queste poche righe, che ciclano e controllano tutti gli input della pagina, ed ha funzionato senza problemi su entrami i browser:

    
    function VerificaForm(){
    var inputs = document.getElementsByTagName('input')
    
        for(i=0;i<inputs.length;i++){
            if(inputs*.value == ''){
                document.getElementById(inputs*.name.toUpperCase()).style.display='inline';
                inputs*.focus()
                return false;
            }
        }  
    }
    
    ```quindi ti consiglio di ricontrollare il codice ;)
    
    ah per quanto riguarda il select "oggetto" e' chiaro che nn puo' funzionare cosi perche' il value nn sara' mai ="", imposta la prima voce (-- seleziona --) con value="0", e poi come codice usa questo
    
    

    var Oggetto = document.getElementById("oggetto")
    if(Oggetto.value=="0"){
    document.getElementById(Oggetto.name.toUpperCase()).style.display='inline';
    Oggetto.focus();
    return false;
    }


  • User Newbie

    grazie zak, ma cosi' non va bene..mi salta un sacco di controlli, come ad esempio quello sul nome, sulla correttezza della mail, sul ceck per la privacy.

    ok invece per la select 😉


  • User

    si... come ti ho detto questo controlla solo gli input. Era solo per dimostrarti che se il codice non ha errori il submit funziona su entrambi i browser.

    Ah un'altra piccola cosa, hai usato un input type="button" con azioni poi al onclick per cancellare tutti i campi del form... beh puoi usare il type="reset" senza aggiungere altro (magari ci metti il value, l'etichetta) per fare questa cosa, e' stato fatto apposta e non genera alcun postBack, peraltro.

    🙂 ciao,
    zak


  • User Newbie

    uhm...si pero' come faccio a fare un controllo completo tipo quello che aveo fatto?
    perdonami, ma di js capisco poco (sto imparando a metterci mano adesso 😛 )