Dubbi con form fatto in html e css

Actionscripter · 22 Lug 2015

Salve a tutti, ho un piccolo problema con un form fatto nei linguaggi citati sopra.

Ho scaricato il form da qui: http://codyhouse.co/gem/css-contact-form/

e successivamente ho cambiato il codice così:

Codice:

<!doctype html>
<html lang="en" class="no-js">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>

	<link rel="stylesheet" href="css/reset.css"> <!-- CSS reset -->
	<link rel="stylesheet" href="css/style.css"> <!-- Resource style -->
	<script src="js/modernizr.js"></script> <!-- Modernizr -->
  	
	<title>Contact us</title>
	<script src='https://www.google.com/recaptcha/api.js' rel="nofollow"></script>
</head>
<body>
	<form class="cd-form floating-labels">
		<fieldset>
			<h1><legend>Contact us</legend></h1>

			<div class="icon">
				<label class="cd-label" for="cd-name">Name</label>
				<input class="user" type="text" name="cd-name" id="cd-name" required>
		    </div>

		    <div class="icon">
				<label class="cd-label" for="cd-surname">Surname</label>
				<input class="user" type="text" name="cd-surname" id="cd-surname" required>
		    </div>

		    <div class="icon">
		    	<label class="cd-label" for="cd-email">Email</label>
				<input class="email" type="email" name="cd-email" id="cd-email" required>
		    </div>
			<div class="icon">
		    	<label class="cd-label" for="cd-email">Object</label>
				<input class="email" type="email" name="object" id="cd-email" required>
		    </div>
			</fieldset>
			
			<fieldset>
			<h2><legend>How can we help you?</legend></h2>
			<div class="icon">
				<label class="cd-label" for="cd-textarea">Message</label>
      			<textarea class="message" name="cd-textarea" id="cd-textarea" required></textarea>
			</div>
		</fieldset>

		<fieldset>

			<div>
				<h2><legend>Personal data</legend></h2>

				<ul class="Privacy ">
					<li>
						<input type="checkbox" id="cd-checkbox-1">
						<label for="cd-checkbox-1">I accept the treatment of my personal data according to the L.D n.196/2003 of Italian law</label>
					</li>
					<div class="g-recaptcha" data-sitekey="6LduBgoTAAAAAJTv0IqbVlirdXJim_xZgE5bn7OR"></div>
			<div>
		      	<input type="submit" value="Send Message">
		    </div>
		</fieldset>
	</form>
<script src="js/jquery-2.1.1.js"></script>
<script src="js/main.js"></script> <!-- Resource jQuery -->
</body>
</html>

e qui nascono i problemi, non riesco a capire 2 cose:

1) Si potrebbero mettere la checkbox e il captcha obbligatori?
2) Devo creare un file php per impostare la mail di destinazione oppure ho dimenticato qualche tag?

Vi ringrazio molto, per le eventuali risposte, saluti!

n1k4r0 · 22 Lug 2015

ciao, la checkbox è un input e quindi se aggiungi la proprietà required dovrebbe funzionare come per gli input di testo.

non ho mai usato recaptcha ma immagino che da qualche parte ci sia la documentazione dove dovrebbe essere scritto come impostarlo.

la form così com'è non ha un action di conseguenza quando la invii ricarica la stessa pagina che la contiene, se vuoi che spedisca un'email devi aggiungere il relativo php alla pagina stessa o creare un file php e impostarlo nel action della form

Actionscripter · 22 Lug 2015

Grazie per la risposta, sono riuscito a rendere il tutto obbligatorio, modificano il codice in questa maniera prima della chiusura del tag </form>

Codice:

<fieldset>

			<div>
				<h2><legend>Personal data</legend></h2>

				<ul class="cd-form-list">
					<li>
						<input type="checkbox" id="cd-checkbox-1">
						<label for="cd-checkbox-1" required>I agree with the L.D n.196/2003 of Italian law for my data treatment</label>
					</li>
			<div>
		      	<input type="submit" value="Send Message">
		    </div>
		</fieldset>
		<div class="g-recaptcha" data-sitekey="6LduBgoTAAAAAJTv0IqbVlirdXJim_xZgE5bn7OR" required></div>

Ora proverò a lavorare sulle funzioni php per spedire il tutto, aspettatevi ancora una mia visita

Actionscripter · 24 Lug 2015

come promesso rieccomi qua, ho impostato un action come suggerito però non riesco a far partire le mail.

il mio codice rinnovato:

HTML:

<!doctype html>
<class="no-js">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>

	<link rel="stylesheet" href="css/reset.css"> <!-- CSS reset -->
	<link rel="stylesheet" href="css/style.css"> <!-- Resource style -->
	<script src="js/modernizr.js"></script> <!-- Modernizr -->
  	
	<title>Contact us</title>
	<script src='https://www.google.com/recaptcha/api.js'></script>
</head>
<body>
	<form class="cd-form floating-labels">
		<form action="php/contact.php" method="post" id="contactform">
		<fieldset>
			<h1><legend>Contact us</legend></h1>
			<div class="icon">
				<label class="cd-label" for="cd-name">Name</label>
				<input class="user" type="text" name="cd-name" id="cd-name" required>
		    </div>

		    <div class="icon">
				<label class="cd-label" for="cd-surname">Surname</label>
				<input class="user" type="text" name="cd-surname" id="cd-surname" required>
		    </div>

		    <div class="icon">
		    	<label class="cd-label" for="cd-email">Email</label>
				<input class="email" type="email" name="cd-email" id="cd-email" required>
		    </div>
			<div class="icon">
		    	<label class="cd-label" for="cd-object">Object</label>
				<input class="email" type="text" name="cd-object" id="cd-object" required>
		    </div>
			</fieldset>
			
			<fieldset>
			<h2><legend>How can we help you?</legend></h2>
			<div class="icon">
				<label class="cd-label" for="cd-textarea">Message</label>
      			<textarea class="message" name="cd-textarea" id="cd-textarea" required></textarea>
			</div>
		</fieldset>

		<fieldset>

			<div>
				<h2><legend>Personal data</legend></h2>

				<ul class="cd-form-list">
					<li>
						<input type="checkbox" id="cd-checkbox-1">
						<label for="cd-checkbox-1" required>I agree with the L.D n.196/2003 of Italian law for my personal data</label>
					</li>
			<div>
		      	<input type="submit" value="Send Message">
		    </div>
		</fieldset>
		<div class="g-recaptcha" data-sitekey="6LduBgoTAAAAAJTv0IqbVlirdXJim_xZgE5bn7OR" required></div>
	</form>
<script src="js/jquery-2.1.1.js"></script>
<script src="js/main.js"></script> <!-- Resource jQuery -->
</body>
</html>

Una piccola precisazione: Tutti i vari script (css, js e php) sono in una cartella chiamata "media".

i codici php:

contact:

PHP:

<?php
 
include 'config.php';
 
error_reporting (E_ALL ^ E_NOTICE);
 
$post = (!empty($_POST)) ? true : false;
 
if($post)
{
$ip = $_SERVER[REMOTE_ADDR];
$name = stripslashes($_POST['name']);
$email = trim($_POST['email']);
$subject = stripslashes($_POST['subject']);
$message = stripslashes($_POST['message']);
 
 
$error = '';
 
 
 
if(!$error)
{
$mail = mail(WEBMASTER_EMAIL, $subject, $message,
     "From: ".$name.' '. $ip." <".$email.">\r\n"
    ."Reply-To: ".$email."\r\n"
    ."X-Mailer: PHP/" . phpversion());
 
 
if($mail)
{
echo 'OK';
}
 
}
 
 
}
?>

Config:

PHP:

<?php
// To
define("WEBMASTER_EMAIL", 'tua-email@mail.com');//definiamo una costante, qui dovrai inserire la tua email
?>

Grazie per l'ulteriore aiuto!

borgo italia · 25 Lug 2015

ciao
una domanda banale: stai provando in locale?
poi come mai hai due tag <form>?

Actionscripter · 25 Lug 2015

Ciao, il primo campo form è nativo del progretto originale (link nel primo post) mentre il secondo il secondo l'ho scritto io per impostare l'action e no, lo sto testando su un dominio on line.

Grazie per la risposta (chiedo scusa nel caso in cui ci siano degli Orrori nel codice ma è la prima volta che costruisco un form con gli script puri, grazie del supporto!)

n1k4r0 · 2015-08-10T18:00:49+0200

borgo italia ha ragione, deve esserci un solo tag form con dentro sia la classe che l'action e il method e l'id. poi spero che nel config tu abbia messo la tua email e non quello che leggo altrimenti il form spedisce a tua-email@mail.com e a meno che non sia la tua email non leggerai mai nulla

Actionscripter · 2015-08-12T01:10:34+0200

Grazie per le risposte, ho risolto un pò di tempo fa,correggendo come avete detto voi e cambiando l'engine con altro codice php, tuttavia ho abbandonato lo stesso questo progetto perchè il risultato finale continuava a non piacermi.

Ringrazio tutti per il supporto!

Cerca

Cerca

Dubbi con form fatto in html e css

Actionscripter

Nuovo Utente

n1k4r0

Utente Attivo

Actionscripter

Nuovo Utente

Actionscripter

Nuovo Utente

borgo italia

Super Moderatore

Actionscripter

Nuovo Utente

n1k4r0

Utente Attivo

Actionscripter

Nuovo Utente

Discussioni simili