Bueno ahora les traigo este tutorial de como ir creando un sistema de registro de usuarios implementando Ajax , Todo con el fin de terminar un registro de usuario muy completo y ahora yo participare con lo que es el ajax se podra ir modificando poco a poco y podras aportar para ir mejorando por tanto dejo lo principal que es el registro.
Ahora el registro esta en V0.1 alpha y lo pongo ahora porque se ira modificando y explicando poco a poco ahora mismo solo pondre el codigo que he creado hasta ahora lo he hecho lo mas simple y practico posible cualquier duda no dudes en comentar. (Lo editare conforme la marcha).
Lo hice en base al defecto del curso paso a paso de cctw por jorgens , basandome en la idea de cesar_ed y piediendole permiso de poder crear el tuto a su idea y su respuesta fue positiva.
Necesitaremos entrar a nuestra bd y entrar a introduccion de SQL e introducir esto :
Bien ahora el codigo de estilo-general.css
Bien ahora regresamos a la raiz de la carpeta (RegistroCCTW) y creamos otra carpeta con el nombre de 'ajax' , entramos en el y dentro creamos un archivo con el nombre registro.js y lo llenamos con el siguiente codigo y lo guardamos :
Bien ahora regresamos a la raiz de carpeta nuevamente (RegistroCCTW) y creamos 3 archivos :
-index.html
-registro.html
-registrar.php
-config.php
y bien abrimos los archivos y empezamos con :
index.html :
registrar.php :
y por ultimo config.php
Ahora las imagenes necesarias :
en momentos.
Bien ya tenemos listo nuestro registro de usuarios con ajax ahora solo necesitamos subirlo a nuestro servidor y testearlo!!
Proximos cambios :
-login.html
-login.php
-logout.php
-Añadir script subir imagen by surkaiser para implementar logo de usuario y con la opcion a subir.
-Mejorar seguridad
-implementacion con registro de Jorgens_CCTW(Esto para hacer el registo final completisimo).
Por ahora es lo previsto cualquier adicion decidme y lo añado a la lista .
Saludos!
Ahora el registro esta en V0.1 alpha y lo pongo ahora porque se ira modificando y explicando poco a poco ahora mismo solo pondre el codigo que he creado hasta ahora lo he hecho lo mas simple y practico posible cualquier duda no dudes en comentar. (Lo editare conforme la marcha).
Lo hice en base al defecto del curso paso a paso de cctw por jorgens , basandome en la idea de cesar_ed y piediendole permiso de poder crear el tuto a su idea y su respuesta fue positiva.
Necesitaremos entrar a nuestra bd y entrar a introduccion de SQL e introducir esto :
--
-- Estructura de tabla para la tabla `usuarios_ajax`
--
CREATE TABLE IF NOT EXISTS `usuarios_ajax` (
`user_id` int(20) NOT NULL AUTO_INCREMENT,
`usuario` varchar(250) NOT NULL,
`clave` text NOT NULL,
`email` text NOT NULL,
PRIMARY KEY (`user_id`)
) ENGINE=MyISAM;Bien ahora el codigo de estilo-general.css
/*
$estilo-general.css (por Jorgens CCTW).
- SurKaiser -
*
* SDRDUCA v0.1 Alpha
* (C) Nov 2011
*
* Ultima Modificacion : 25/11/2011 por : SurKaiser
*
- Sistema De Registro De Usuarios Con Ajax(SDRDUCA)
- Es de codigo abierto puedes modificarlo y editarlo al gusto
- Si utilizaras el codigo en un tutorial , intentar dar referencia al autor
*
*
* No olvides consultar :
*
* http://www.comocreartuweb.com/consultas/
*
* Para cualquier duda o pregunta.
*
*
-
*/
* {text-indent:0px ; margin:0px ; padding:0px ; border:0px }
p {text-align: justify}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
body {text-align: center }
#global {width:800px ; margin:4px auto }
#curva-superior { background-image: url(../index_files/objetos/curva-superior.gif) ;
background-repeat: no-repeat ;
width: 800px ;
height:12px ;
overflow: hidden }
#cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid ; height:85px}
#logotipo {width:280px ; float:left }
#publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 16px }
#navegacion {background-color: gray ; border: black 1px solid ; height:20px}
#navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px }
#navegacion ul { margin-left: 60px }
#contenido {background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid }
#contenido p {margin: 5px 10px 0px 10px ; text-indent: 15px}
#menu {background-color: lorange ; width: 150px ; float:left ;
text-align:left ; margin: 3px 10px 3px 3px ;
background-image: url(../index_files/objetos/menu-parte-inferior.gif);
background-position: bottom ;
padding-bottom:5px }
#menu li {list-style:none ; margin: 4px 8px 4px 6px }
#menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;background-image: url(../index_files/objetos/menu-parte-superior.gif) }
#pie {border-left: black 1px solid ;
border-right: black 1px solid ;
border-top: black 1px solid ;
height: 65px }
#pie li {list-style: none ; font-size: 10px }
#pieuno {float:left ; width:150px ; list-style:none }
#piedos {float:left ; width:498px }
#pietres {float:left ; width:150px }
#curva-inferior { background-image: url(../index_files/objetos/curva-inferior.gif) ;
background-repeat: no-repeat ;
width: 800px ;
height:12px ;
overflow: hidden }
a {color: brown ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline ; background-color: silver}
a:active {}
#pie a {color: blue; text-decoration:none ; display: block }
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:black ; text-decoration:underline ; background-color: white }
#pie a:active {color:black}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}Bien ahora regresamos a la raiz de la carpeta (RegistroCCTW) y creamos otra carpeta con el nombre de 'ajax' , entramos en el y dentro creamos un archivo con el nombre registro.js y lo llenamos con el siguiente codigo y lo guardamos :
/*
$registro.js
- SurKaiser -
*
* SDRDUCA v0.1 Alpha
* (C) Nov 2011
*
* Ultima Modificacion : 25/11/2011 por : SurKaiser
*
- Sistema De Registro De Usuarios Con Ajax(SDRDUCA)
- Es de codigo abierto puedes modificarlo y editarlo al gusto
- Si utilizaras el codigo en un tutorial , intentar dar referencia al autor
*
*
* No olvides consultar :
*
* http://www.comocreartuweb.com/consultas/
*
* Para cualquier duda o pregunta.
*
*
-
*/
function obtenerXMLHttpRequest()
{
try {
req = new XMLHttpRequest();
} catch (err1) {
try {
req = new ActiveXObject ("Msxml2.XMLHTTP");
} catch (err2) {
try {
req = new ActiveXObject ("Microsoft.XMLHTTP");
} catch (err3) {
req = false;
}
}
}
return req;
}
var conexion = obtenerXMLHttpRequest();
function registrar()
{
var info = document.getElementById('informacion');
var usuario = document.formulario.usuario.value;
var clave = document.formulario.clave.value;
var clavev = document.getElementById('confc');
var texto = document.getElementById('correo');
if( usuario == '')
{
info.innerHTML = '<p style="color:red">Ups, Olvidaste ingresar un nombre de usuario</p>';
}
else if(usuario.length <= 4)
{
info.innerHTML = '<p style="color:red">Para registrarte . EL nombre de usuario de contener mas de 4 caracteres</p>';
}
else {
if(clave == "")
{
info.innerHTML = '<p style="color:red">Antes de registrarte debes elegir una contraseña</p>';
}
else if( clave.length <= 6)
{
info.innerHTML = '<p style="color:red">No puedes registrarte por que : Tu clave no es segura , debe ser de mas de 6 caracteres</p>';
}
else if ( clave != clavev.value )
{
info.innerHTML = '<p style="color:red">Antes de registrarte , debes confirmar correctamente tu contraseña</p>';
}
else {
if(texto.value == '')
{
info.innerHTML = '<p style="color:red"> La direccion de correo electronica no es correcta </p>';
}
else {
var mailres = true;
var cadena = "abcdefghijklmnñopqrstuvwxyzABCDEFGHIJKLMNÑOPQRSTUVWXYZ1234567890@._-";
var arroba = texto.value.indexOf("@",0);
if ((texto.value.lastIndexOf("@")) != arroba) arroba = -1;
var punto = texto.value.lastIndexOf(".");
for (var contador = 0 ; contador < texto.value.length ; contador++){
if (cadena.indexOf(texto.value.substr(contador, 1),0) == -1){
mailres = false;
break;
}
}
if ((arroba > 1) && (arroba + 1 < punto) && (punto + 1 < (texto.value.length)) && (mailres == true)
&& (texto.value.indexOf("..",0) == -1))
{
registrando();
}
else {
info.innerHTML = '<p style="color:red">La direccion de correo electronica no es correcta. <br> Ingresa una direccion de correo electronica correcta para poderte registrar</p>';
}
}
}
}
}
function registrando()
{
var cargando = document.getElementById('carR');
cargando.innerHTML = 'Registrando.......';
var usuario = document.formulario.usuario.value;
var clave = document.formulario.clave.value;
var correo = document.formulario.correo.value;
var aleatorio = parseInt(Math.random()*99999999);
var url = "registrar.php";
conexion.open("POST", url , true);
conexion.onreadystatechange = InformacionR;
conexion.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
conexion.send("mode=registrar&usuario="+ usuario +"&clave=" + clave +"&correo=" + correo +"&randomize=" + aleatorio);
}
function InformacionR()
{
if(conexion.readyState == 4)
{
if(conexion.status == 200)
{
var cargando = document.getElementById('carR');
cargando.innerHTML = '';
var informacion = document.getElementById('informacion');
informacion.innerHTML = conexion.responseText;
}
}
}
function llamarAjax()
{
var textoTd = document.getElementById('resultadoU');
textoTd.innerHTML = 'Comprobando....';
var usuario = document.getElementById('usuario');
var u = usuario.value;
var Aleatorio =parseInt(Math.random()*99999999);
var url = "registrar.php";
conexion.open("POST", url , true);
conexion.onreadystatechange = respuestaAjax;
conexion.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
conexion.send("mode=c_usuario&usuario=" + u + "&rand="+ Aleatorio);
}
function respuestaAjax()
{
if(conexion.readyState == 4)
{
if(conexion.status == 200)
{
var textoTd = document.getElementById('resultadoU');
textoTd.innerHTML = conexion.responseText;
}
else {
alert("Ha ocurrido un error:" + conexion.statusText);
}
}
}
function cargando (campo)
{
if(campo.name == "usuario")
{
var texto = document.getElementById('textoU');
texto.innerHTML = 'Cargando.....';
}
else if (campo.name == "clave")
{
var texto = document.getElementById('textoC');
texto.innerHTML = 'Cargando.....';
}
else if (campo.name == "confirm")
{
var texto = document.getElementById('textoCR');
texto.innerHTML = 'Cargando.....';
}
else if (campo.name == "correo")
{
var texto = document.getElementById('textoMail');
texto.innerHTML = 'Cargando.....';
}
else if (campo.name == "captcha")
{
var texto = document.getElementById('textoCap');
texto.innerHTML = 'Cargando.....';
}
else {
}
}
function comprobarU(usuario){
var texto = document.getElementById('textoU');
var textoTd = document.getElementById('resultadoU');
texto.innerHTML = '';
var contenido = usuario.value;
if(contenido.length <= 4)
{
textoTd.innerHTML = '<p style="color:red">Tu nombre de usuario debe contener mas de 4 caracteres</p>';
}
else if ( contenido.length > 4)
{
llamarAjax();
}
else {
}
}
function comprobarC(clave)
{
var texto = document.getElementById('textoC');
var textoTd = document.getElementById('resC');
texto.innerHTML = '';
var contenido = clave.value;
if(contenido.length <= 6)
{
textoTd.innerHTML = '<p style="color:red">Tu Contraseña debe contener minimo mas de 6 caracteres</p>';
}
else if ( contenido.length > 6)
{
textoTd.innerHTML = '<p style="color:green">Correcto</p>';
}
else{
}
}
function comprobarCR(claver)
{
var texto = document.getElementById('textoCR');
var textoTd = document.getElementById('resCR');
var c = document.getElementById('clave');
texto.innerHTML = '';
var contenido = claver.value;
if (c.value == '')
{
textoTd.innerHTML = '<p style="color:red">Primero ingresa tu contraseña</p>';
}
else if (contenido == c.value)
{
textoTd.innerHTML = '<p style="color:green">Correcto</p>';
}
else {
textoTd.innerHTML = '<p style="color:red">Las claves no coinciden</p>';
}
}
function comprobarMail(texto){
var textoMail = document.getElementById('textoMail');
var textoRes = document.getElementById('resMail');
textoMail.innerHTML= '';
var mailres = true;
var cadena = "abcdefghijklmnñopqrstuvwxyzABCDEFGHIJKLMNÑOPQRSTUVWXYZ1234567890@._-";
var arroba = texto.value.indexOf("@",0);
if ((texto.value.lastIndexOf("@")) != arroba) arroba = -1;
var punto = texto.value.lastIndexOf(".");
for (var contador = 0 ; contador < texto.value.length ; contador++){
if (cadena.indexOf(texto.value.substr(contador, 1),0) == -1){
mailres = false;
break;
}
}
if ((arroba > 1) && (arroba + 1 < punto) && (punto + 1 < (texto.value.length)) && (mailres == true)
&& (texto.value.indexOf("..",0) == -1))
{
textoRes.innerHTML = '<p style="color:green">Correcto</p>';
}
else {
textoRes.innerHTML = '<p style="color:red">La direccion de correo electronica proporcionada no es correcta.</p>';
}
}
function ComprobarCap(numero)
{
var texto = document.getElementById('textoCap');
texto.innerHTML = '';
var respuesta = document.getElementById('resCap');
respuesta.innerHTML = '<p>Comprobando</p>';
aleatorio = parseInt(Math.random()*99999999);
url = 'registrar.php?mode=verificarcaptcha';
conexion.open('GET',url +'&codigo='+ numero.value +'&randomize='+ aleatorio,true);
conexion.onreadystatechange = captcha;
conexion.send(null);
}
function captcha()
{
if (conexion.readyState == 4)
{
if (conexion.status == 200)
{
var textoTd = document.getElementById('resCap');
textoTd.innerHTML = conexion.responseText;
}
else {
alert("Ha ocurrido un error:" + conexion.statusText);
}
}
}Bien ahora regresamos a la raiz de carpeta nuevamente (RegistroCCTW) y creamos 3 archivos :
-index.html
-registro.html
-registrar.php
-config.php
y bien abrimos los archivos y empezamos con :
index.html :
<!--
$index.html (Diseño por Jorgens CCTW).
/*
- SurKaiser -
*
* SDRDUCA v0.1 Alpha
* (C) Nov 2011
*
* Ultima Modificacion : 25/11/2011 por : SurKaiser
*
- Sistema De Registro De Usuarios Con Ajax(SDRDUCA)
- Es de codigo abierto puedes modificarlo y editarlo al gusto
- Si utilizaras el codigo en un tutorial , intentar dar referencia al autor
*
*
* No olvides consultar :
*
* http://www.comocreartuweb.com/consultas/
*
* Para cualquier duda o pregunta.
*
*
-
*/
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="Content-Type">
<title>Página Oficial de la banda</title>
<link rel="stylesheet" href="estilos/estilo-general.css" type="text/css" media="all">
</head><body>
<div id="global">
<div id="curva-superior"></div>
<!-- INICIO DE CODIGO DE CABECERA - NO TOCAR -->
<div id="cabecera">
<div id="logotipo"><a href="http://www.comocreartuweb.com/html-kit-tutorial/web-ejemplo-cctw-001/index.html"><img src="estilos/logotipo.gif" alt="Haz clic aquí para volver a la página de inicio" height="80" width="270"></a></div>
<div id="publicidad">Bienvenidos a mi Web</div>
</div>
<div id="navegacion">
<ul>
<li><a href="index.html">Inicio</a></li>
<li><a href="registro.html">Registrarse</a></li>
<li><a href="#">Iniciar Sesion</a></li>
</ul>
</div>
<!-- FIN DE CODIGO DE CABECERA -->
<div id="contenido">
<!-- INICIO DE CODIGO DE MENU LATERAL IZQUIERDO - NO TOCAR -->
<!-- FIN DE CODIGO DE MENU LATERAL IZQUIERDO -->
<h1>Bienvenidos a la página oficial de la banda</h1>
<p>Bienvenido a la página oficial de la banda. En este portal puedes
estar informado de todo lo referente al grupo, desde su historia hasta
sus próximos conciertos, pasándo por su completa discografía, descarga
de cosas interesantes e incluso por nuestra tienda online, en la que
puedes encargar tu camiseta del grupo.</p>
<p>No olvides visitarnos en el foro y dejar tus comentarios.</p>
<p>Gracias por la visita, esperamos verte pronto!
</p>
</div>
<div id="pie">
<div id="pieuno">
<ul>
<li><a href="#">Foro Ejemplo</a></li><li><a href="#">Contactos</a></li><li><a href="#">Nos Enlazan</a></li>
</ul>
</div>
<div id="piedos">pie dos</div>
<div id="pietres">
<ul>
<li><a href="#">Directorio</a></li><li><a href="#">TopSite</a></li><li><a href="#">Mapa de la Web</a></li>
</ul>
</div>
</div>
<!-- INICIO DE CODIGO DE PIE DE PAGINA - NO TOCAR -->
<div id="curva-inferior"></div>
</div>
</body></html><!--
$registro.html (Diseño por Jorgens CCTW).
/*
- SurKaiser -
*
* SDRDUCA v0.1 Alpha
* (C) Nov 2011
*
* Ultima Modificacion : 25/11/2011 por : SurKaiser
*
- Sistema De Registro De Usuarios Con Ajax(SDRDUCA)
- Es de codigo abierto puedes modificarlo y editarlo al gusto
- Si utilizaras el codigo en un tutorial , intentar dar referencia al autor
*
*
* No olvides consultar :
*
* http://www.comocreartuweb.com/consultas/
*
* Para cualquier duda o pregunta.
*
*
-
*/
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="Content-Type">
<title>Página Oficial de la banda</title>
<link rel="stylesheet" href="estilos/estilo-general.css" type="text/css" media="all">
<script type="text/javascript" language="javascript" src="ajax/registro.js"></script>
</head><body>
<div id="global">
<div id="curva-superior"></div>
<!-- INICIO DE CODIGO DE CABECERA - NO TOCAR -->
<div id="cabecera">
<div id="logotipo"><a href="http://www.comocreartuweb.com/html-kit-tutorial/web-ejemplo-cctw-001/index.html"><img src="estilos/logotipo.gif" alt="Haz clic aquí para volver a la página de inicio" height="80" width="270"></a></div>
<div id="publicidad">Bienvenidos a mi Web</div>
</div>
<div id="navegacion">
<ul>
<li><a href="index.php">Inicio</a></li>
<li><a href="registro.html">Registrar</a></li>
<li><a href="iniciar.html">Iniciar sesion</a>
</li>
</ul>
</div>
<!-- FIN DE CODIGO DE CABECERA -->
<div id="contenido">
<!-- INICIO DE CODIGO DE MENU LATERAL IZQUIERDO - NO TOCAR -->
<!-- FIN DE CODIGO DE MENU LATERAL IZQUIERDO -->
<h1>Registro:</h1>
<form name="formulario">
<table border="0px">
<tr>
<td>Nombre de usuario:</td>
<td><input type="text" name="usuario" id="usuario" onKeyPress="cargando(this)" onBlur="comprobarU(this)" /></td>
</tr>
<tr>
<td id="textoU"></td>
<td id="resultadoU"></td>
</tr>
<tr>
<td>Contraseña:</td>
<td><input type="password" name="clave" id="clave" onKeyPress="cargando(this)" onBlur="comprobarC(this)" /></td>
</tr>
<tr>
<td id="textoC"></td>
<td id="resC"></td>
<tr>
<td>Confirma Contraseña:</td>
<td><input id="confc" type="password" name="confirm" onClick="cargando(this)" onkeyup="comprobarCR(this)"/></td>
</tr>
<tr>
<td id="textoCR"></td>
<td id="resCR"></td>
</tr>
<tr>
<td>Direccion de Correo electronico(e-mail):</td>
<td><input type="text" id="correo" name="correo" onKeyPress="cargando(this)" onBlur="comprobarMail(this)"></td>
</tr>
<tr>
<td id="textoMail"></td>
<td id="resMail"></td>
</tr>
<tr>
<td>Ingresa el codigo que ves en la siguiente imagen:<br>
<center> <img src="registrar.php?mode=captcha" width="100" height="30" vspace="3"></center></td>
<td><input type="text" id="captcha" name="captcha" onClick="cargando(this)" onKeyUp="ComprobarCap(this)"></td>
</tr>
<tr>
<td id="textoCap"></td>
<td id="resCap"></td>
</tr>
<tr>
<td></td>
<td><input type="button" value="Registrar" onclick="registrar();"/></td>
</tr>
<tr>
<td id="carR"></td>
<td id="informacion"></td>
</tr>
</table>
</form>
</div>
<div id="pie">
<div id="pieuno">
<ul>
<li><a href="#">Foro Ejemplo</a></li><li><a href="#">Contactos</a></li><li><a href="#">Nos Enlazan</a></li>
</ul>
</div>
<div id="piedos">pie dos</div>
<div id="pietres">
<ul>
<li><a href="#">Directorio</a></li><li><a href="#">TopSite</a></li><li><a href="#">Mapa de la Web</a></li>
</ul>
</div>
</div>
<!-- INICIO DE CODIGO DE PIE DE PAGINA - NO TOCAR -->
<div id="curva-inferior"></div>
</div>
</body></html>registrar.php :
<?php
/*
$registrar.php
- SurKaiser -
*
* SDRDUCA v0.1 Alpha
* (C) Nov 2011
*
* Ultima Modificacion : 25/11/2011 por : SurKaiser
*
- Sistema De Registro De Usuarios Con Ajax(SDRDUCA)
- Es de codigo abierto puedes modificarlo y editarlo al gusto
- Si utilizaras el codigo en un tutorial , intentar dar referencia al autor
*
*
* No olvides consultar :
*
* http://www.comocreartuweb.com/consultas/
*
* Para cualquier duda o pregunta.
*
*
-
*/
include("./config.php");
$mode = $_POST['mode'];
$modeg = $_GET['mode'];
if($mode == 'c_usuario')
{
$u = $_POST['usuario'];
if($u == '')
{
echo 'Hubo un error de procesamiento AJAX';
}
else {
db_conect();
$obtener_usuario = mysql_query("SELECT * FROM usuarios_ajax WHERE usuario ='".$u."'") or die(mysql_error());
$contar = mysql_num_rows($obtener_usuario);
if( $contar >= 1)
{
echo '<p style="color:red">El usuario <span style="color:blue">'.$u.'</span> ya esta en uso, por favor elige otro.</p>';
}
else {
echo '<p style="color:green">El usuario <span style="color:blue">'.$u.'</span> esta disponible!!!</p>';
}
}
}
else if($mode == 'registrar')
{
$us = $_POST['usuario'];
$cl = md5($_POST['clave']);
$email = $_POST['correo'];
if($us == '' && $cl == '')
{
echo 'Hubo un error de procesamiento AJAX';
}
else {
db_conect();
$obtener_usuario = mysql_query("SELECT * FROM usuarios_ajax WHERE usuario ='".$us."'") or die(mysql_error());
$contar = mysql_num_rows($obtener_usuario);
if( $contar >= 1)
{
echo '<p style="color:red">No puedes registrarte ya que el usuario <span style="color:blue">'.$us.'</span> ya esta en uso, por favor elige otro.</p>';
}
else {
$obtener_correo = mysql_query("SELECT * FROM usuarios_ajax WHERE email ='".$email."'") or die (mysql_error());
$contar_correo = mysql_num_rows($obtener_correo);
if($contar_correo >= 1)
{
echo '<p style="color:red">No puedes registrarte ya que el correo <span style="color:blue">'.$email.'</span> ya esta en uso, por favor elige otro.</p>';
}
else {
$insertar = mysql_query("INSERT INTO usuarios_ajax(usuario,clave,email)
VALUES ('".$us."','".$cl."','".$email."')") or die(mysql_error());
echo 'Te has registrado correctamente , vuelve a registrarte aqui : <a href="registro37.html">Registrarse</a>';
}
}
}
}
else if($modeg == 'captcha')
{
session_start();
function randomText($length) {
$pattern = "1234567890abcdefghijklmnopqrstuvwxyz";
for($i=0;$i<$length;$i++) {
$key .= $pattern{rand(0,35)};
}
return $key;
}
$_SESSION['tmptxt'] = randomText(8);
$captcha = imagecreatefromgif("bgcaptcha.gif");
$colText = imagecolorallocate($captcha, 0, 0, 0);
imagestring($captcha, 5, 16, 7, $_SESSION['tmptxt'], $colText);
header("Content-type: image/gif");
imagegif($captcha);
}
else if($modeg == 'verificarcaptcha')
{
$codigo = $_GET['codigo'];
session_start();
if ($_SESSION['tmptxt'] == $codigo) {
echo '<p style="color:green">Correcto</p>';
} else {
echo '<p style="color:red">El codigo que has ingresado es incorrecto</p>';
}
}
else
{
}
?>y por ultimo config.php
<?php
/*
$config.php
- SurKaiser -
*
* SDRDUCA v0.1 Alpha
* (C) Nov 2011
*
* Ultima Modificacion : 25/11/2011 por : SurKaiser
*
- Sistema De Registro De Usuarios Con Ajax(SDRDUCA)
- Es de codigo abierto puedes modificarlo y editarlo al gusto
- Si utilizaras el codigo en un tutorial , intentar dar referencia al autor
*
*
* No olvides consultar :
*
* http://www.comocreartuweb.com/consultas/
*
* Para cualquier duda o pregunta.
*
*
-
*/
function db_conect()
{
$s=mysql_connect("servidor mysql","usuario","clave");
$d=mysql_select_db("Base de datos");
}
?>Ahora las imagenes necesarias :
en momentos.
Bien ya tenemos listo nuestro registro de usuarios con ajax ahora solo necesitamos subirlo a nuestro servidor y testearlo!!
Proximos cambios :
-login.html
-login.php
-logout.php
-Añadir script subir imagen by surkaiser para implementar logo de usuario y con la opcion a subir.
-Mejorar seguridad
-implementacion con registro de Jorgens_CCTW(Esto para hacer el registo final completisimo).
Por ahora es lo previsto cualquier adicion decidme y lo añado a la lista .
Saludos!