En esta entrada os pongo un ejemplo de un formulario realizado en Html y como envia los datos a un archivo php para guardar dichos datos en un fichero de texto.
Para ello crearemos 2 archivos, mas adelante veremos que se puede realizar con uno solo.
Para empezar creamos el archivo html, que nombraremos como formulario.html, consistente en:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<link rel="stylesheet" href="hojadeestilo.css">
<title>Archivo de texto</title>
</head>
<body>
<header>
<h1>Archivo de texto</h1>
<figure><img src="milogo.jpeg"/></figure>
</header>
<nav>
<ul>
<li><a href="index.html">Inicio</a></li><li><a href="acercade.html">Acerca de</a></li>
</ul>
</nav>
<section>
<article>
<hgroup>
<h1>Archivos</h1>
<h2>practica textos</h2>
</hgroup>
<form action="guardar.php" method="post" name="form">
<input type="text" name="nombre"/><br>
<textarea name="comentario"></textarea><br>
<input type="submit" value="Guardar datos"/>
</form>
</article>
</section>
<aside><h1>Siguenos en:</h1>
<ul>
<li><a href="facebook.html">Facebook</a>
</li><li><a href="twitter.html">Twitter</a></li>
</ul></aside>
<footer>
<p>Pagina creada por Ticoticotaa @2016</p>
<ul>
<li><a href="contacto.html">Contacto</a>
</li><li><a href="mapaweb.html">Mapa Web</a></li>
</ul></footer>
</body>
</html>
El ejemplo de codigo html que tomo como base para agregar el formulario lo podeis obtener de mi
Blog Html5 . En dicho blog se explican las etiquetas de Html usadas y el Css.
Lo unico que añadimos aqui es el formulario entre las etiquetas article,
incluyendo el nombre del archivo php al que se enviaran los datos, la
forma de enviarlos (post) y el nombre de los campos que enviamos (nombre
y comentario), junto con el boton que ejecuta el envio.
El siguiente codigo lo nombramos como guardar.php que obtiene los datos del formulario para guardarlos en un archivo de texto segun este codigo:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<link rel="stylesheet" href="hojadeestilo.css">
<title>Guarda Datos</title>
</head>
<body>
<header>
<h1>Guarda datos</h1>
<figure><img src="milogo.jpeg"/></figure>
</header>
<nav>
<ul>
<li><a href="index.html">Inicio</a></li><li><a href="acercade.html">Acerca de</a></li>
</ul>
</nav>
<section>
<article>
<hgroup>
<h1>Obtengo datos de formulario y los guardo en texto</h1>
<h2>practica</h2>
</hgroup><?php
$fichero=fopen("archivo.txt","a") or die ("error"); // "a" para escritura
fwrite($fichero,"Datos: ");
fwrite($fichero,"\n");//salto de linea
fwrite($fichero,$_POST['nombre'];
fwrite($fichero,"\n");//salto de linea
fwrite($fichero,$_POST['comentario'];
fwrite($fichero,"---------------------------\n");//salto de linea
fclose($fichero);
echo"<p>Datos guardados</p>";
?>
</article>
</section>
<aside><h1>Siguenos en:</h1>
<ul>
<li><a href="facebook.html">Facebook</a>
</li><li><a href="twitter.html">Twitter</a></li>
</ul></aside>
<footer>
<p>Pagina creada por Ticoticotaa @2016</p>
<ul>
<li><a href="contacto.html">Contacto</a>
</li><li><a href="mapaweb.html">Mapa Web</a></li>
</ul></footer>
</body>
</html>
El codigo php que obtiene los datos lo marco en rojo para destacarlo,
este codigo esta incrustado en el codigo html como vimos en anterior
entrada, asi podemos mantener el formato de la pagina y cambiar solo el
contenido que necesitamos, en este caso tomamos los datos del formulario y abrimos el fichero para escritura.
Contemplamos tambien el caso del error con "or die".
El resto del codigo se explica con los comentarios.
Espero os sea util.
