esercizio javascript e form!

[aneres]

come si fa??
non ho mai fatto i form e vorrei vedere come si svolge un esercizio di questo genere....

Si realizzi la form (gestita in Javascript) che permetta l'iscrizione ad un gruppo sportivo. L'esercizio ha lo scopo di imparare le tecniche relative alla validazione dei campi di una form dal lato client.

La scheda deve contenere i seguenti campi:

Nome: campo di testo da 20 chrs max (campo obbligatorio)

Cognome: campo di testo da 20 chrs max (campo obbligatorio)

Data di nascita : gg/mm/aa dove gg,mm, aaaa sono inseriti tramite dei campi di testo con i seguenti valori: gg = [1-31];mm=[1,12] aa=[00,99]

Città ; campo di testo 20 chrs max

Telefono : prefisso =4 chrs numerici ; numero = 10 chrs numerici . (campo obbligatorio)

Sesso : 2 radio button (M,F)

Quando viene selzionato il sesso, compaiono i gruppi sportivi da scegliere per maschi /femmine ( sono diversi)- Usare i livelli (nascosti o visibili).

I gruppi sportivi sono dati mediante delle SELECT (dropdownlist) e le scelte sono:

Gruppi maschili: calcio, basket, nuoto, pallavolo

Gruppi femminili : ginnastica ritmica, nuoto, pallavolo, nuoto sincronizzato


Scelto uno sport vengono visualizzati gli orari dei corsi possibili, che possono essere scelti mediante dei radio button



Al submit (invio della form) visualizzare un campo di alert con i campi errati o mancanti. In alternativa visualizzare i campi errati o mancanti nella pagina stessa evidenziando il motivo di errore del campo.

Se la form è corretta aprire una nuova finestra dove si specifica il nome e cognome dell'iscritto , il corso e l'eventuale orario di iscrizione

 

[criric]

Ciao,
non credo che troverai qualcuno disposto a postarti tutto l'esercizio

dovresti postare un po di codice e su argomenti diversi

io per i campi obbligatori comincerei cosi

<script type="text/javascript">
    function checkForm(form) {
        // crei la variabile messaggio
        var messaggio = "";
        //conti gli elementi del form
        var elementi = form.elements.length; 
        // cicli il modulo
        for(var i = 0; i < elementi; i++){
            // recuperi name e valore
            var name = form.elements[i].name;
            var value = form.elements[i].value;
            // se il name fa parte degli obbligatori
            if(name == "nome" || name == "cognome") {
                // lo verifichi
                var verifica = richiesto(name,value);
                // e nel caso aggiorni la variabile verifica
                if(verifica) {
                    messaggio += verifica 
                }
            }
        }
        // alla fine dei controlli verifichi se ci sono messaggi
        if(messaggio != "") {
            // mostri l'alert
            alert(messaggio)
            // blocchi l'esecuzione uscendo
            return;
        } 
        // altrimenti invii i dati , mostri i messaggi etc
        form.submit();
    }
    function richiesto(name,campo) {                               
        if(campo == "") {
            return "Il campo " + name + " è obbligatorio\n";
        }
        return false;
    }
</script>

<form name="form" action="form.html" onsubmit="checkForm(this);return false">
    Nome : <input type="text" name="nome"/><br/>
    Cognome : <input type="text" name="cognome"/><br/>
    <input type="submit" name="invia" value="Invia"/>
</form>

 

[aneres]

Ciao,
non credo che troverai qualcuno disposto a postarti tutto l'esercizio

dovresti postare un po di codice e su argomenti diversi

io per i campi obbligatori comincerei cosi

<script type="text/javascript">
    function checkForm(form) {
        // crei la variabile messaggio
        var messaggio = "";
        //conti gli elementi del form
        var elementi = form.elements.length; 
        // cicli il modulo
        for(var i = 0; i < elementi; i++){
            // recuperi name e valore
            var name = form.elements[i].name;
            var value = form.elements[i].value;
            // se il name fa parte degli obbligatori
            if(name == "nome" || name == "cognome") {
                // lo verifichi
                var verifica = richiesto(name,value);
                // e nel caso aggiorni la variabile verifica
                if(verifica) {
                    messaggio += verifica 
                }
            }
        }
        // alla fine dei controlli verifichi se ci sono messaggi
        if(messaggio != "") {
            // mostri l'alert
            alert(messaggio)
            // blocchi l'esecuzione uscendo
            return;
        } 
        // altrimenti invii i dati , mostri i messaggi etc
        form.submit();
    }
    function richiesto(name,campo) {                               
        if(campo == "") {
            return "Il campo " + name + " è obbligatorio\n";
        }
        return false;
    }
</script>

<form name="form" action="form.html" onsubmit="checkForm(this);return false">
    Nome : <input type="text" name="nome"/><br/>
    Cognome : <input type="text" name="cognome"/><br/>
    <input type="submit" name="invia" value="Invia"/>
</form>

ti ringrazio

 

[marcopupi]

mail

ciao a tutti,
scusate per la domanda banale ma non sono esperto!
vorrei sapere nella pagina form.html che codice ci vuole per mandare il form compilato a un indirizzo mail ??
resto in attesa

grazie mille

buona serata
Marco

 

[borgo italia]

ciao
dai un occhio qui
https://www.mrw.it/html/inviare-email-tramite-form-solo-html_6847.html
però inviare solo con html+javascript non è il sistema migliore, ti conviene usare un linguaggio dinamico, es. php

 

[marcopupi]

sto impazzendo

ciao
dai un occhio qui
https://www.mrw.it/html/inviare-email-tramite-form-solo-html_6847.html
però inviare solo con html+javascript non è il sistema migliore, ti conviene usare un linguaggio dinamico, es. php

ma scusa il form sopra è in javascript e invia il tutto a una pagina html . in quella pagina che codice bisogna mettere all'inizio per mandare il form compilato alla mia mail??

ti ringrazio anticipatamente

marco

 

[borgo italia]

ciao
il form è in html, la parte js è solo
action="mailto: pinco@tuo_sito.it"
qull'istruzione apre il client di posta dell'utente (es outlook) con i campi compilati (molto brutti) e l'utente da l'invio sul client.
con js altro non puoi ottenere.
puoi mettere volendo anche dei controlli (es. se non compili l'oggetto), ma gira gira il risultato è lo stesso.
comunque come ti dicevo js è un pessimo metodo:
1. se l'utente NON ha installato un client non invia
2. anche se ci sono controlli i controlli js sono facilmente aggirabili
ti posto anche un link con i controlli, ma ribadisco E' UN PESSIMO MODO
http://www.orebla.it/forum/webmaster-f5/inviare-mail-con-html-javascript-t185.html

 

[marcopupi]

Scusami ma non riesco a capireee

ciao
il form è in html, la parte js è solo
action="mailto: pinco@tuo_sito.it"
qull'istruzione apre il client di posta dell'utente (es outlook) con i campi compilati (molto brutti) e l'utente da l'invio sul client.
con js altro non puoi ottenere.
puoi mettere volendo anche dei controlli (es. se non compili l'oggetto), ma gira gira il risultato è lo stesso.
comunque come ti dicevo js è un pessimo metodo:
1. se l'utente NON ha installato un client non invia
2. anche se ci sono controlli i controlli js sono facilmente aggirabili
ti posto anche un link con i controlli, ma ribadisco E' UN PESSIMO MODO
http://www.orebla.it/forum/webmaster-f5/inviare-mail-con-html-javascript-t185.html

Ciao, scusa ma non riesco a capire che codice devo mettere in questa pagina form.html

ho provato tt il giorno ma niente da fare
gentilmente me lo puoi scrivere

ti ringrazio

 

[marcopupi]

ti scrivo il mio codice

il codice che ho messo in tutte le pagine è :

<h4>RICHIESTE INFO</h4>
<form id="form_prenotazione" name="form_prenotazione" method="post" action="prenotazione.html" onsubmit="return validateFormPrenotazione();">
<input name="nomecognome" type="text" id="nomecognome" value="nominativo" onfocus="this.value=''" />
<input name="email" type="text" id="email" value="e-mail" onfocus="this.value=''" />
<textarea name="messaggio">Note</textarea>
<input type="checkbox" name="checkbox" value="checkbox" />
<a href="#" onclick="window.open('privacy.html','','scrollbars =yes,width=500,height=500,location =1'); return false;">privacy</a> 
<input type="submit" name="Submit_prenotazione" value="RICHIEDI ORA" class="submitbutton" /> 
</form>

ho provato a inserire questo codice all'inizio della pagina
prenotazione.html

<?php
mail('[email protected]',$_POST['nomecognome'], $_POST['email'], $_POST['messaggio'], $_POST['checkbox'] , $_POST['submit']);
?>

Poi pagina HTML ...
ti ringrazio

 

[borgo italia]

ciao
ecco uno schema (brutale) per ricevere email

<!DOCTYPE html">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Documento senza titolo</title>
</head>
<body>
<?php
if(isset($_POST['Submit_prenotazione'])){
	$to = "[email protected]";//se hai una casella di posta a dominio sarebbe meglio quella
	$subject = "richiesta informazioni";
	//qui ci vorrebbero i controlli, per oratralascio
	$message ="nome: ".$_POST['nomecognome']."\r\n";
	$message .= "nome: ".$_POST['email']."\r\n";
	$message .= "nome: ".$_POST['messaggio']."\r\n";
	$message .= "------------------------------\r\n";
	$privacy="accetto le condizioni di privacy";
	if($_POST['privacy'] !="si"){$privacy="non accetto le condizioni di privacy";}
	$message .= $privacy;
	$headers = "From: ".$_POST['email']." \r\n" .
    "Reply-To: ".$_POST['email']." \r\n";
	mail($to, $subject, $message, $headers);
}
?>
<h4>RICHIESTE INFO</h4>
<form id="form_prenotazione" name="form_prenotazione" method="post" action="<?php echo $_SERVER['PHP_SELF'];?>" onsubmit="return validateFormPrenotazione();">
<input name="nomecognome" type="text" id="nomecognome" value="nominativo" onfocus="this.value=''" />
<input name="email" type="text" id="email" value="e-mail" onfocus="this.value=''" />
<textarea name="messaggio">Note</textarea>
<input type="checkbox" name="privacy" value="si" />
<a href="#" onclick="window.open('privacy.html','','scrollbars =yes,width=500,height=500,location =1'); return false;">privacy</a> 
<input type="submit" name="Submit_prenotazione" value="RICHIEDI ORA" class="submitbutton" /> 
</form>
</body>
</html>

una cosa importante: le pagine che non posssno chiamarsi es. prenotazione.html ma prenotazione.php
dai un occhio e su quello che non capisci chiedi

p.s.
quando posti del codice formattalo con il suo tag (seconda riga di formattazione del post, ultime tre iconcine, nell'ordine CODE , HTML , PHP)

 

[marcopupi]

ti ringrazio

Scusa ma non riesco a capire come funziona il form di questo sito
villaggioelisena.it
non capisco la tecnica che hanno usato...

 

[borgo italia]

ciao
se parli dei form nella home: probabilmente un linguaggio dinamico (php o asp) il tutto probabilmente condito con javascript e jquery per l'invio e html e css per il form

 

[marcopupi]

Riusciresti

Ma riusciresti ad individuare cosa mi manca in questo metodo ??? Praticamente ho copiato tt del form compresi i collegamenti convalida dati ... Ma non capisco dove si metta l'invio cn la mail !!! È da più di 2 mesi che sto provando e riprovando !!! Ma niente da fare ...

 

[marcopupi]

aiuuuuuuto

scusa il disturbo,
mi scriveresti
qui ci vorrebbero i controlli, per oratralascio

ti ringrazio,

dopo aver mandato il form come faccio a mandarlo in un altra pagina ??


grazie ancora


Buona domenica

Marco