[Javascript] comando innerHTML non funziona

#Fede5

Nuovo Utente
23 Ott 2019
11
0
1
Ciao ragazzi, ho scritto il seguente codice html per creare un form di contatto ma non capisco perché nello script validate( ) innerHTML non funziona mentre se lo sostituisco con alert i controlli funzionano perfettamente. Qualcuno mi può aiutare? Grazie


HTML:
<!DOCTYPE html>
<html>
<head>   
<title>Form</title>
<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1">
    
<link rel="stylesheet" href="css/style.css">


    
<!--Font Awesome-->   
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<script src="https://kit.fontawesome.com/a076d05399.js"></script>
    
<!--Font Awesome--> 
    
<!--JQuery-->     
    
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
<!--JQuery-->     
    
<!--Bootstrap -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<!--Bootstrap -->   
 
</head>
    
    
<body>


<div class="form">
    <h2>Richiedi maggiori informazioni</h2>
    
    <div id="errorMessage"></div> 
        
    <form  name="modulo" method="post" onsubmit="return validate()">
      
  
  
    <label for="nome">Nome:</label>
    <input type="text" id="nome" name="nome" placeholder="Nome *">
        
 
    <label for="cognome">Cognome:</label>
    <input type="text" id="cognome" name="cognome" placeholder="Cognome *">   
    
    
    <label for="email">Email:</label>
    <input type="email" id="email" name="email" placeholder="Email *">
    
        
  
    <label for="numero">Telefono:</label>
    <input type="text" id="telefono" name="email" placeholder="Telefono">   
        
    
    <label for="oggetto">Oggetto:</label>
    <input type="text" id="oggetto" name="oggetto" placeholder="Oggetto *">
          
    
    <label for="messaggio">Messaggio:</label>   
        <textarea id="messaggio" name="messaggio" placeholder="Messaggio *"></textarea>
    <input type="submit" value="Invia" >     
    </form>
        
    </div>
    </div>

<script type="text/javascript">
    
function validate(){
var nome = document.modulo.nome.value;
var cognome = document.modulo.cognome.value;
var email = document.modulo.email.value;
var telefono = document.modulo.telefono.value;
var oggetto = document.modulo.oggetto.value;
var messaggio = document.modulo.messaggio.value;
var car_alf = /^([a-zA-Z\xE0\xE8\xE9\xF9\xF2\xEC\x27]\s?)+$/; 
var mailformat = /^([a-zA-Z0-9_.-])[email protected](([a-zA-Z0-9-]{2,})+.)+([a-zA-Z0-9]{2,})+$/; 
    
    
    
var errorBox = document.getElementById("errorMessage");
    
var alertDiv = '<div class="alert alert-danger alert-dismissible" role="alert">';
    

    
if(nome=="" || nome == "undefined" || cognome=="" || cognome == "undefined" || email=="" || oggetto == "" || oggetto == "undefined" || messaggio == "" || messaggio == "undefined"){
    errorBox.innerHTML = alertDiv + '<strong>Attenzione!</strong> Tutti i campi devono essere compilati' + "</div>";
    document.modulo.nome.focus();
   
    return false;   
}
 
//verifica correttezza nome
if(!car_alf.test(nome)){
     confirm("Il nome inserito non è valido");
     document.modulo.nome.focus();
     event.preventDefault();
     return false;
 }
  
//verifica correttezza cognome   
 if(!car_alf.test(cognome)){
     confirm("Il cognome inserito non è valido");
     document.modulo.cognome.focus();
     event.preventDefault();
     return false;
 }
    
//verifica correttezza email
 if(!mailformat.test(email)){
    confirm("L'email inserita non è valida");
    document.modulo.email.focus();
     event.preventDefault();
     return false;
 }   
    
//verifica correttezza telefono
if(isNaN(telefono)){
  confirm("Il telefono inserito non è valido");
    document.modulo.email.focus();
     event.preventDefault();
     return false;   
}   
    

    
    
   else{
  confirm("Grazie,invio la conferma");
  document.invio.submit();
  document.invio.action ="homepahe.php#form";
 
   }
}
    
    
    
    </script>     
    
    
    <!--Script validazione form -->
      
        
    

</body>
</html>
 

mr.x

Utente Attivo
9 Apr 2016
252
25
28
HTML:
    <label for="numero">Telefono:</label>
    <input type="text" id="telefono" name="email" placeholder="Telefono">

correggi il name
 

mr.x

Utente Attivo
9 Apr 2016
252
25
28
Senzanome.jpg


questo il risultato ottenuto con la sola correzione che ti ho segnalato.. cos'è che nn ti funziona?
 

#Fede5

Nuovo Utente
23 Ott 2019
11
0
1
Vedi l'allegato 6748

questo il risultato ottenuto con la sola correzione che ti ho segnalato.. cos'è che nn ti funziona?
la parte di codice che non funziona è questa

HTML:
if(nome=="" || nome == "undefined" || cognome=="" || cognome == "undefined" || email=="" || oggetto == "" || oggetto == "undefined" || messaggio == "" || messaggio == "undefined"){
    errorBox.innerHTML = alertDiv + '<strong>Attenzione!</strong> Tutti i campi devono essere compilati' + "</div>";
    document.modulo.nome.focus();
  
    return false;   
}
 

mr.x

Utente Attivo
9 Apr 2016
252
25
28
come sopra, solo correggendo il name..
Risltato si riceve un avviso di compilare tutti i campi se en manca almeno 1 di quelli obbligatori.
Poi non capisco se volessi ottenere un altro risultato, da quanto hai scritto questo è ciò che ho capito.

Senzanome2.jpg


volendo poi scrivere un codice leggermente più pulito

HTML:
     <div id="error" class="alert alert-danger alert-dismissible" role="alert"></div> <!-- nuova riga segnaposto -->
 <!--   <div id="errorMessage"></div>  -->
       
    <form  name="modulo" method="post" onsubmit="return validate()">

.....

HTML:
if(nome=="" || nome == "undefined" || cognome=="" || cognome == "undefined" || email=="" || oggetto == "" || oggetto == "undefined" || messaggio == "" || messaggio == "undefined"){
// errorBox.innerHTML = alertDiv + '<strong>Attenzione!</strong> Tutti i campi devono essere compilati' + "</div>";
document.getElementById('error').innerHTML = '<strong>Attenzione!</strong> Tutti i campi devono essere compilati';// <- nuova riga
 
Discussioni simili
Autore Titolo Forum Risposte Data
G [Javascript] eseguire test-case Selenium da riga di comando... Javascript 0
F E' possibile inviare un comando DOS con javascript o altro linguaggio?? Javascript 1
L countdown multiplo javascript Javascript 1
S Problemi Javascript + Aruba Javascript 2
M Inviare un file su un server remoto con JavaScript Javascript 0
T a href="javascript:;" Javascript 0
F Creare elementi html con javascript Javascript 4
A pulsante di update campo mysql con javascript Javascript 2
8 Javascript - PDF Form Javascript 0
B javascript per problemi con pdf e Safari Javascript 0
N informazione javascript Programmazione 0
I Eecuzione di javascript in ciclo foreach php. PHP 7
P javascript:document.forms Javascript 7
S Consiglio esercizio Javascript Javascript 2
MarcoGrazia Aggiungere o rimuovere classi in javascript Javascript 1
P Passaggio id php a javascript PHP 6
E lettura da un Database con Javascript jQuery 2
V TRIS in javascript Javascript 1
IClaude Funzione Javascript Javascript 8
Alex_70 Javascript date color Javascript 3
F Convertire JavaScript per la compatibilità nei browser obsoleti Javascript 0
I Passare dei parametri in javascript PHP 0
Shyson Meglio Javascript o HTML? Javascript 4
M Chiamare pagina php da javascript Javascript 8
M Errore JavaScript per php [objeto HTMLParagraphElement] PHP 0
D Javascript per il download dei dati Javascript 0
grgfede Problema javascript con aruba Javascript 1
webmachine [PHP] [JAVASCRIPT] Form strano in HTML PHP PHP 1
W Modificare il Type di un Input box in javascript ovunque si trovi Javascript 0
I javascript come caricare una pagina sopra quella corrente in automatico Javascript 2
L [Javascript] Problema salvataggio dati in db Javascript 1
max1974 [Javascript] Grafico chartjs con dati da J.ajax Javascript 3
G Quiz Javascript Javascript 4
A [Javascript] Scrittura su più campi contemporaneamente Javascript 19
F classic asp popolare combo box javascript Presentati al Forum 1
claudio_lorenzo [Javascript] aiuto su jquery per calcolo altezze dom Javascript 1
alexice51 proggrammi per scrivere in javascript? Javascript 3
max1974 [Javascript] Accordion aria-exspanded Javascript 0
D [Javascript] salvare immagine canvas - paypal Javascript 0
O [Javascript] Conflitto Jquery: forse... Javascript 0
M [Javascript] Canvas js css Javascript 1
M Programmazione web HTML, CSS e JavaScript Offerte e Richieste di Lavoro e/o Collaborazione 6
G [Javascript] Errore inserimento dati Backend Node.js e workbench Javascript 1
A Creare con Javascript un percorso all'interno di uno spazio Javascript 0
D [Javascript] inserire uno script in un file php Javascript 6
Monital [Javascript] inserire dati estratti dal db in html fisso Javascript 1
K [javascript] Tecnica per rilevare celle contenenti caratteri ricevute in dinamico Javascript 1
F [JavaScript] Ottenere il CSS dopo transform: scale() e transform-origin Javascript 0
S [Javascript] Problema costrutto if Javascript 0
I [Javascript] window.location.href porta alla nuova pagina e ritorna incomprensibilmente. Javascript 0

Discussioni simili