En este tutorial aprenderemos a validar nuestros formularios usando PHP y jQuery en ambos lados: la parte del cliente (usando javascript con jQuery) y la parte del servidor (usando PHP). Será realmente interesante ver cómo en PHP apenas necesitamos ya las expresiones regulares para validar por ejemplo un e-mail y otros tipos de campos y conocer los motivos por los que se debe hacer una doble validación.

Autor:

Hola! Soy diseñador, programador web y cofundador de la startup Cokidoo, desarrollamos aplicaciones web a gran escala y comercio electrónico, aplicaciones para móviles y advertising. Puedes seguirme através de mi twitter y ver algunos de mis themes en Themeforest. También soy aficionado a la fotografía.
Descarga Demostración

Introducción: ¿Qué vamos a hacer?

A día de hoy a nadie se le escapa que el Javascript está jugando un papel bastante importante en la interacción y usabilidad de los sitios web, para bien… y para mal (pero eso daría para escribir otro artículo completo).

Procesos como el registro de un nuevo usuario son cada vez más interactivos y ofrecen multitud de tips / consejos, avisos y otros tipo de alertas antes de que la página se recargue al “pinchar en enviar”. Muchas de estas comprobaciones: saber si un nombre de usuario ya existe, si la contraseña cumple los requisitos, si un e-mail es correcto, etc se comprueban mediante Javascript.

Así pues nosotros trataremos de validar un formulario con los siguientes campos a validar:

  • Nombre de usuario
  • Contraseña
  • E-mail
  • Sitio Web (Opcional)

Los requisitos para cada campo los analizaremos con calma en los siguientes pasos del tutorial, pero como habréis visto todos serán obligatorios salvo el sitio web, que lo consideraremos opcional. ¡Vamos a ello!

Paso 1: La estructura

Como en otras ocasiones, la estructura del documento no será excesivamente importante, ya que lo importante será conocer las formas de validación del formulario, pero vamos a tratar de hacer algo vistoso para nuestro ejemplo. Simple pero funcional:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es-ES">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Cómo validar un formulario utilizando PHP y Javascript (jQuery) | Web.Ontuts</title>
	<link rel="stylesheet" href="main.css" type="text/css" media="screen" />
</head>
<body>
	<div class="wrapper">
		<div class="section">
			<?php if(!isset($status)): ?>
			<h1>Formulario de validación en Cliente + Servidor</h1>
			<form id="form1" action="index.php" method="post">
				<label for="username">Nombre de usuario (<span id="req-username" class="requisites <?php echo $username ?>">A-z, mínimo 4 caracteres</span>):</label>
				<input tabindex="1" name="username" id="username" type="text" class="text <?php echo $username ?>" value="<?php echo $usernameValue ?>" />
				<label for="password1">Contraseña (<span id="req-password1" class="requisites <?php echo $password1 ?>">Mínimo 5 caracteres, máximo 12 caracteres, letras y números</span>):</label>
				<input tabindex="2" name="password1" id="password1" type="password" class="text <?php echo $password1 ?>" value="" />
				<label for="password2">Repetir Contraseña (<span id="req-password2" class="requisites <?php echo $password2 ?>">Debe ser igual a la anterior</span>):</label>
				<input tabindex="3" name="password2" id="password2" type="password" class="text <?php echo $password2 ?>" value="" />
				<label for="email">E-mail (<span id="req-email" class="requisites <?php echo $email ?>">Un e-mail válido por favor</span>):</label>
				<input tabindex="4" name="email" id="email" type="text" class="text <?php echo $email ?>" value="<?php echo $emailValue ?>" />
				<label for="website">Sitio Web (Opcional):</label>
				<input tabindex="5" name="website" id="website" type="text" class="text" value="<?php echo $websiteValue ?>" />
				<div>
					<input tabindex="6" name="send" id="send" type="submit" class="submit" value="Enviar formulario" />
				</div>
			</form>
			<?php else: ?>
				<h1>¡Formulario enviado con éxito!</h1>
			<?php endif; ?>
		</div>
	</div>
	<script type="text/javascript" src="jquery.js"></script> 
	<script type="text/javascript" src="main.js"></script>
</body>
</html>

Para los más despistados, podríamos comentar que hemos utilizado algunas propiedades interesantes en esta estructura HTML:

  • tabindex: en los elementos input del formulario, para que reciban el foco en el orden deseado al pulsar la tecla tabulador.
  • for: en los elementos label, permiten que al hacer click en cada label, el input con el id correspondiente reciba el foco.

Y poco más que añadir, vamos a echar un vistazo rápido a la hoja de estilos utilizada.

Paso 2: Añadiendo un poco de estilo con CSS

Una vez más, estamos utilizando un CSS reset al inicio de nuestra hoja de estilos para posteriormente dar un poco de estilo a nuestro formulario de ejemplo:

@CHARSET "UTF-8";
/*
Author: Adrian Mato
Author URI: http://www.yensdesign.com & http://web.ontuts.com
*/

/******* GENERAL RESET *******/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,
 tfoot, thead, tr, th, td {
border:0pt none;
font-family:inherit;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0pt;
padding:0pt;
vertical-align:baseline;
}
body{
	line-height: 1em;
	font-size: 12px;
	background: #262626 url(img/bg.png) repeat scroll 0 0;
	font-family: Myriad Pro, Arial, Helvetica, sans-serif;
	margin: 0pt;
	cursor: default;
}
table{
	border-collapse: separate;
	border-spacing: 0pt;
}
strong{
	font-weight: 700;
}
caption, th, td{
	font-weight:normal;
	text-align:left;
}
blockquote:before, blockquote:after, q:before, q:after{
	content:"";
}
blockquote, q{
	quotes:"" "";
}
pre{
	font-family: Arial, Helvetica, sans-serif;
}
input{
	border: 0;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
}
textarea{
	font-family: Arial, Helvetica, sans-serif;
	color: #888888;
	padding: 7px 3px 0 4px;
	font-size: 11px;
}
select{
	font-size: 11px;
	color: #888888;
	background: #fff;
	font-family: Arial, Helvetica, sans-serif;
	border: 1px solid #CAD2CE;
}
ul{
	list-style: none;
	list-style-type: none;
	list-style-position: outside;
}
a{
	cursor: pointer;
	color: #296ba5;
	text-decoration: none;
	outline: none !Important;
}
html,body{
	height:100%;
}
.clear{
	clear: both;
	height: 0;
	visibility: hidden;
	display: block;
	line-height: 0;
}
.clearfix{
	overflow: hidden;
}
.fleft{
	float: left;
}
.fright{
	float: right;
}
.italic{
	font-style: italic;
}
/******* /GENERAL RESET *******/

/******* CONTENT *******/
.wrapper{
	width: 640px;
	margin: 0pt auto;
	padding-top: 10px;
}
h1{
	color: #fff;
	font-size: 26px;
	line-height: 3em;
}
label{
	display: block;
	color: #e4e1cd;
	line-height: 2em;
	font-size: 14px;
}
.section{
	margin-bottom: 25px;
}
input.text, input.submit{
	width: 70%;
	background: #171717 url(img/search.png) no-repeat scroll right 2px;
	padding: 8px;
	color: #8c8c8c;
	border: 1px solid #393939;
	margin-bottom: 15px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	font-size: 16px;
}
input.text.active{
	background: #343434 url(img/search.png) no-repeat scroll right -43px;
	border-color: #000;
	color: #fff;
}
input.submit{
	width: auto !Important;
	background: #f5f5f5;
	color: #000;
	border-color: #c8c8c8;
	padding: 5px;
	margin-top: 0.5em;
}
.requisites{
	padding: 0 2px 0 2px;
}
.requisites.error{
	text-decoration: underline;
	background: #fff8cc;
	color: #171717;
}
input.error{
	background: #432323;
	border-color: #171717;
}
/******* /CONTENT *******/

Como habréis visto, hemos reutilizado en su mayor parte todo el CSS del tutorial anterior Mejorando las cajas de búsqueda mediante jQuery. Una vez más dejamos para el final la parte interesante :)

Paso 3: Validando en el lado del cliente con Javascript (jQuery)

Como de costumbre, para la validación mediante Javascript en el lado del cliente (navegador) utilizaremos jQuery. Es importante reconocer porqué estamos haciendo una doble validación, en este caso en el lado del cliente y posteriormente del lado del servidor: Por motivos de seguridad, nunca podremos confiar en el cliente ni en los datos que nos proporciona para nuestros scripts.

La doble validación formada por cliente + servidor nos garantiza que aunque el cliente desactive el Javascript por diversas razones, el script de lado del servidor siempre se encargará de validar nuevamente todos los datos introducidos por el usuario, asegurando así la fiabilidad de los mismos.

Una vez conocido el porqué de la doble validación, vamos a comenzar con las primeras líneas de nuestro archivo de javascript main.js, encargado de gestionar toda la validación del lado del cliente.

Document ready y variables de referencia

Para los más experimentados con jQuery quizás no les resulte necesario, pero cabe destacar la utilización en la primera línea de la función $(document).ready, la cual nos garantiza que nuestro código javascript no se ejecutará hasta que todo el documento ha sido cargado en el navegador, evitando así “errores undefined” y otros más por no encontrar los elementos necesarios. Dicho esto, vamos a guardar las referencias a los distintos elementos en variables.

Inicialmente nuestro javascript sería este:

$(document).ready(function(){
	//variables globales
	var searchBoxes = $(".text");
	var inputUsername = $("#username");
	var reqUsername = $("#req-username");
	var inputPassword1 = $("#password1");
	var reqPassword1 = $("#req-password1");
	var inputPassword2 = $("#password2");
	var reqPassword2 = $("#req-password2");
	var inputEmail = $("#email");
	var reqEmail = $("#req-email");
)};

Como siempre, guardamos las referencias a los distintos elementos en variables, para una mayor optimización y facilidad de uso.
Es importante recordar que todo lo que expliquemos apartir de ahora irá debajo de esta declaración de variables, dentro del evento $(document).ready.

Funciones de validación

Centrándonos en la parte interesante del tutorial, vamos a crear las siguientes funciones de validación:

  • validateUsername(): Nombres de la A a la z con un mínimo de 4 caracteres
  • validatePassword1(): Mínimo de 5 caracteres, máximo 12 caracteres, sólo letras y números
  • validatePassword2(): Debe coincidir con la contraseña anterior
  • validateEmail(): El e-mail debe ser válido

Así pues, estas serían nuestras funciones definidas:

//funciones de validacion
function validateUsername(){
	//NO cumple longitud minima
	if(inputUsername.val().length < 4){
		reqUsername.addClass("error");
		inputUsername.addClass("error");
		return false;
	}
	//SI longitud pero NO solo caracteres A-z
	else if(!inputUsername.val().match(/^[a-zA-Z]+$/)){
		reqUsername.addClass("error");
		inputUsername.addClass("error");
		return false;
	}
	// SI longitud, SI caracteres A-z
	else{
		reqUsername.removeClass("error");
		inputUsername.removeClass("error");
		return true;
	}
}
function validatePassword1(){
	//NO tiene minimo de 5 caracteres o mas de 12 caracteres
	if(inputPassword1.val().length < 5 || inputPassword1.val().length > 12){
		reqPassword1.addClass("error");
		inputPassword1.addClass("error");
		return false;
	}
	// SI longitud, NO VALIDO numeros y letras
	else if(!inputPassword1.val().match(/^[0-9a-zA-Z]+$/)){
		reqPassword1.addClass("error");
		inputPassword1.addClass("error");
		return false;
	}
	// SI rellenado, SI email valido
	else{
		reqPassword1.removeClass("error");
		inputPassword1.removeClass("error");
		return true;
	}
}
function validatePassword2(){
	//NO son iguales las password
	if(inputPassword1.val() != inputPassword2.val()){
		reqPassword2.addClass("error");
		inputPassword2.addClass("error");
		return false;
	}
	// SI son iguales
	else{
		reqPassword2.removeClass("error");
		inputPassword2.removeClass("error");
		return true;
	}
}
function validateEmail(){
	//NO hay nada escrito
	if(inputEmail.val().length == 0){
		reqEmail.addClass("error");
		inputEmail.addClass("error");
		return false;
	}
	// SI escrito, NO VALIDO email
	else if(!inputEmail.val().match(/^[^\s()<>@,;:\/]+@\w[\w\.-]+\.[a-z]{2,}$/i)){
		reqEmail.addClass("error");
		inputEmail.addClass("error");
		return false;
	}
	// SI rellenado, SI email valido
	else{
		reqEmail.removeClass("error");
		inputEmail.removeClass("error");
		return true;
	}
}

En alguna de nuestras funciones hemos utilizado expresiones regulares para facilitar la comprobación, por ejemplo, para reconocer si un e-mail es considerado válido o no, si no estás familiarizado con ellas te recomiendo que eches una ojeada por algunos artículos y trates de reconocer el porqué de cada una de ellas.

Las expresiones regulares nos permiten realizar las comprobaciones de forma eficiente, segura y rápida de nuestros distintos tipos datos: e-mail, número de teléfono, tipos de datos propios… y todo lo que se nos pueda ocurrir, siempre y cuando seamos capaces de escribir el patrón para la expresión regular.

Como habéis podido comprobar, estamos continuamente añadiendo / quitando la clase “error” de nuestro CSS para notificar al usuario que se está equivocando en algún campo del formulario, cambiando el aspecto del campo y su label si fuese necesario.

Ahora que ya tenemos nuestras funciones de validación listas para usar, debemos pensar en qué eventos son necesarias para poder llamarlas y utilizarlas de forma adecuada.

Llamando a las funciones de validación en los eventos

Con todo el material listo para usar, sólo nos queda decidir en qué eventos pediremos a nuestro código javascript que compruebe la validación de nuestros datos en el formulario. En nuestro caso serán los siguientes:

  • Validaremos el nombre en: pérdida de foco y pulsación de tecla
  • Validaremos el e-mail en: pérdida de foco
  • Validaremos las contraseñas en: pérdida de foco y pulsación de tecla
  • Validaremos todos los campos en: envío de formulario

Este será el código con el que gestionaremos estos eventos y la validación:

//controlamos la validacion en los distintos eventos
// Perdida de foco
inputUsername.blur(validateUsername);
inputEmail.blur(validateEmail);
inputPassword1.blur(validatePassword1);  
inputPassword2.blur(validatePassword2);  

// Pulsacion de tecla
inputUsername.keyup(validateUsername);
inputPassword1.keyup(validatePassword1);
inputPassword2.keyup(validatePassword2);

// Envio de formulario
$("#form1").submit(function(){
	if(validateUsername() & validatePassword1() & validatePassword2() & validateEmail())
		return true;
	else
		return false;
});

Con todo esto, hemos dejado lista la parte de validación de lado del cliente… ¡vamos a por la del servidor!

Paso 4: Validando en el lado del servidor con PHP

Como ya hemos comentado anteriormente, no podemos confiar nunca en el cliente por tanto, necesitamos realizar la misma validación de datos de lado del servidor. La lógica de validación será muy similar a la empleada en el código javascript, salvando las diferencias del lenguaje.

Funciones de validación mediante PHP

Crearemos pues un archivo php llamado “index.php” en el cual definiremos las funciones de validación. Básicamente recrearemos los mismos requisitos que vimos en el lado del cliente (via javascript) pero en PHP:

function validateUsername($name){
	//NO cumple longitud minima
	if(strlen($name) < 4)
		return false;
	//SI longitud pero NO solo caracteres A-z
	else if(!preg_match("/^[a-zA-Z]+$/", $name))
		return false;
	// SI longitud, SI caracteres A-z
	else
		return true;
}

function validatePassword1($password1){
	//NO tiene minimo de 5 caracteres o mas de 12 caracteres
	if(strlen($password1) < 5 || strlen($password1) > 12)
		return false;
	// SI longitud, NO VALIDO numeros y letras
	else if(!preg_match("/^[0-9a-zA-Z]+$/", $password1))
		return false;
	// SI rellenado, SI email valido
	else
		return true;
}

function validatePassword2($password1, $password2){
	//NO coinciden
	if($password1 != $password2)
		return false;
	else
		return true;
}

function validateEmail($email){
	//NO hay nada escrito
	if(strlen($email) == 0)
		return false;
	// SI escrito, NO VALIDO email
	else if(!filter_var($_POST['email'], FILTER_SANITIZE_EMAIL))
		return false;
	// SI rellenado, SI email valido
	else
		return true;
}

Mezclando las dos partes en una sóla…

Una vez tenemos las funciones de validación, sólo nos queda mezclar la estructura HTML anterior del Paso 1, con la lógica correspondiente en el PHP para tenerlo todo funcionando correctamente. Este sería el resultado final del index.php:

<?php

function validateUsername($name){
	//NO cumple longitud minima
	if(strlen($name) < 4)
		return false;
	//SI longitud pero NO solo caracteres A-z
	else if(!preg_match("/^[a-zA-Z]+$/", $name))
		return false;
	// SI longitud, SI caracteres A-z
	else
		return true;
}

function validatePassword1($password1){
	//NO tiene minimo de 5 caracteres o mas de 12 caracteres
	if(strlen($password1) < 5 || strlen($password1) > 12)
		return false;
	// SI longitud, NO VALIDO numeros y letras
	else if(!preg_match("/^[0-9a-zA-Z]+$/", $password1))
		return false;
	// SI rellenado, SI email valido
	else
		return true;
}

function validatePassword2($password1, $password2){
	//NO coinciden
	if($password1 != $password2)
		return false;
	else
		return true;
}

function validateEmail($email){
	//NO hay nada escrito
	if(strlen($email) == 0)
		return false;
	// SI escrito, NO VALIDO email
	else if(!filter_var($_POST['email'], FILTER_SANITIZE_EMAIL))
		return false;
	// SI rellenado, SI email valido
	else
		return true;
}

//Comprobacion de datos
//variables valores por defecto
$username = "";
$usernameValue = "";
$password1 = "";
$password2 = "";
$email = "";
$emailValue = "";
$websiteValue = "";

//Validacion de datos enviados
if(isset($_POST['send'])){
	if(!validateUsername($_POST['username']))
		$username = "error";
	if(!validatePassword1($_POST['password1']))
		$password1 = "error";
	if(!validatePassword2($_POST['password1'], $_POST['password2']))
		$password2 = "error";
	if(!validateEmail($_POST['email']))
		$email = "error";
	
	//Guardamos valores para que no tenga que reescribirlos
	$usernameValue = $_POST['username'];
	$emailValue = $_POST['email'];
	$websiteValue = $_POST['website'];
	
	//Comprobamos si todo ha ido bien
	if($username != "error" && $password1 != "error" && $password2 != "error" && $email != "error")
		$status = 1;
}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es-ES">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Cómo validar un formulario utilizando PHP y Javascript (jQuery) | Web.Ontuts</title>
	<link rel="stylesheet" href="main.css" type="text/css" media="screen" />
</head>
<body>
	<div class="wrapper">
		<div class="section">
			<?php if(!isset($status)): ?>
			<h1>Formulario de validación en Cliente + Servidor</h1>
			<form id="form1" action="index.php" method="post">
				<label for="username">Nombre de usuario (<span id="req-username" class="requisites <?php echo $username ?>">A-z, mínimo 4 caracteres</span>):</label>
				<input tabindex="1" name="username" id="username" type="text" class="text <?php echo $username ?>" value="<?php echo $usernameValue ?>" />
				<label for="password1">Contraseña (<span id="req-password1" class="requisites <?php echo $password1 ?>">Mínimo 5 caracteres, máximo 12 caracteres, letras y números</span>):</label>
				<input tabindex="2" name="password1" id="password1" type="password" class="text <?php echo $password1 ?>" value="" />
				<label for="password2">Repetir Contraseña (<span id="req-password2" class="requisites <?php echo $password2 ?>">Debe ser igual a la anterior</span>):</label>
				<input tabindex="3" name="password2" id="password2" type="password" class="text <?php echo $password2 ?>" value="" />
				<label for="email">E-mail (<span id="req-email" class="requisites <?php echo $email ?>">Un e-mail válido por favor</span>):</label>
				<input tabindex="4" name="email" id="email" type="text" class="text <?php echo $email ?>" value="<?php echo $emailValue ?>" />
				<label for="website">Sitio Web (Opcional):</label>
				<input tabindex="5" name="website" id="website" type="text" class="text" value="<?php echo $websiteValue ?>" />
				<div>
					<input tabindex="6" name="send" id="send" type="submit" class="submit" value="Enviar formulario" />
				</div>
			</form>
			<?php else: ?>
				<h1>¡Formulario enviado con éxito!</h1>
			<?php endif; ?>
		</div>
	</div>
	<script type="text/javascript" src="jquery.js"></script> 
	<script type="text/javascript" src="main.js"></script>
</body>
</html>

¿Cómo pruebo sólo el lado del servidor?

Si queréis probar cómo funcionaría el ejemplo si alguien desactivase el javascript / no tuviese soporte javascript en su navegador, simplemente desactivarlo o bien comentar / quitar la línea en la que se incluye el archivo main.js y podréis verlo sin problemas.

¡Ya hemos terminado con nuestra doble validación de formulario!

Reflexión final

Puede llegar a parecer un tutorial tedioso, demasiado denso o grande, pero lo cierto es que no es nada complicado. Teniendo bien claro el objetivo y los pasos que hemos de afrontar para lograr la doble validación del lado del cliente y del servidor, el proceso resulta realmente sencillo.

Si algo podemos sacar en claro de este tutorial es que las expresiones regulares son muy potentes en cualquier lenguaje de programación, y que nunca hay que confiar en los datos introducidos por el usuario, es siempre recomendable comprobarlos para evitar futuros errores de diversa índole.

Quizás las expresiones y la lógica del archivo final PHP no sea la más optimizada, ni la más rápida, pero he creído conveniente hacerla así para que le resulte a todo el mundo cómodo y fácil de seguir. Como siempre digo, un tutorial debe arrojar un poco de luz a un problema, cada caso requiere una solución distinta, pero comprendiendo lo que se explica en el tutorial, podremos dar rienda a nuestra imaginación y solucionar los problemas relacionados con lo que aquí hemos explicado.

¡Os espero en el próximo tutorial!

¿Necesitas desarrollar un proyecto web o para móviles? ¡Estamos disponibles!

Visitar Cokidoo

Cokidoo, los creadores de Ontuts, desarrollamos proyectos tecnológicos centrados en redes sociales y aplicaciones web, aplicaciones móviles y consultoría web y bases de datos.

Somos jóvenes, inquietos, versátiles, apasionados por la innovación y enfocados en las nuevas tecnologías. Con Ontuts tratamos de compartir nuestro conocimiento adquirido en los distintos proyectos, ayudando a la comunidad y mostrando nuestra capacidad tecnológica.

Si necesitas un presupuesto sin compromiso, estamos disponibles, no dudes en contactar con nosotros.

Comentarios en esta publicación (71 comentarios)

¿Te ha gustado esta publicación? ¡Puedes compartir tu opinión con todos nosotros! Simplemente pincha aquí mismo.

Carlos

Y el ejemplo online? es que no puedes hacer las cosas bien?

roc

Soy novato y estoy creandoo una web y me gustaria saber donde puedo tener un eslider

Hola Adrian tengo una duda disculpame si no lovi pero endonde pone uno su correo para que cuando llenen el formulario llegue alli (a mi correo).
Gracias y disculpame.

German

Holas como puedo hacer que las contraseñas no se borren si me equivoco…!!!

ademas dices kitemos esta linea () pero tambien en tu codigo hay otra linea que dice () sim embargo no compartiste el “main.js” pero si compartiste el “main css puedes aclararme esta duda xfavor…!!!

winstrol

magnificent submit, very informative. I’m wondering why the opposite experts of this sector don’t notice this. You should continue your writing. I’m sure, web.ontuts.com have a huge readers’ base already!

Adrián

Arcadio, cuando creas un formulario para enviar a través de una web, no se envía directamente a un email, si no a otra página que procese los datos y haga con ellos lo que se haya programado. Si tu quieres crear un formulario que envíe un email busca en google algo como “codigo php envio formulario email”. Espero te sea de ayuda

El que insultó a Carlos el Bobo

Ese tal Carlos, sí el del primer comentario, es un bobo. Si quieres el ejemplo online entonces pruébalo tu mismo, pedazo de bobo. TONTO…

Jesús Ernesto

Hola Adrián excelente tutorial, estoy probando tu validación pero no he podido validar un campo tipo textarea, la pregunta es que sí se puede ??? y sí puedes, me podrías ayudar por favor poniendo un ejemplo o algo así…, de antemano muchas gracias por tus atenciones…

Orlando Flores

Carlos, puedes ser un poco menos hostil en tus comentarios. O es que es que te despiertas reprendiendo al sol por salir? Repartiendo veneno a diestra y siniestra? jeje

dave raffo

bien todo bacan PERO que pasa si quiero que mis funciones estén en una api de seguridad
mediante :
validatePassword2(input,mensaje)
???? no funciona tu codigo

Eze

Excelente! solo quiero saber como enviar el formulario a un mail?

samuel

de verdad muchas gracias por lo que haces y que Dios te bendiga, ya 2 de tus tutoriales me han servido para continuar desarrollando mi proyecto, gracias!!!

Leo

Muchas gracias comprade , esta super bueno, ahora vere como lo implemente con base de datos

Naza

muy bien explicado! gracias por tu aporte! lo que estaba buscando y mas!

Juan Zapata

Hola Adrian: Como sería la validación si en el formulario se incluye una foto del usuario para subir al servidor

Tavo

Muy bien la informacion!! En pocas ocasiones escriben codigo y lo explican bien!!!

jjjjj

//suponiendo que $entrada guarda el valor enviado por el formulario //$entrada_txt almacenará una cadena de texto segura $entrada_txt = htmlentities(trim(strip_tags(stripslashes($entrada))), ENT_NOQUOTES, “UTF-8″); //en este caso $entrada_html almacenará una cadena con html $entrada_html = strip_tags(htmlentities(trim(stripslashes($entrada))), ENT_NOQUOTES, “UTF-8″);

hunter

yo no entiendo como lo haces intente modificar uno para tlefono y no lo acepta ayudame quiero validar telefono targeta de credito y fecha

camilo

Exelente tutorial, me fue de gran ayuda

wilox

Que buen tuto…. Gracias a personas como vos es que la red crece.. Gracias man