Saltar al contenido
Codif铆ca.me | Desarrollo web | Programaci贸n

C贸mo realizar una validaci贸n de un campo as铆ncrona con Ajax y php

5 diciembre, 2016

En esta entrada vamos a poner el c贸digo para poder realizar una validaci贸n de campo as铆ncrona con Ajax y php.
Estos son los ficheros que utilizaremos, puedes renombrarlos a tu gusto, pero no se te olvide cambiarlos tambi茅n en las llamadas.

index.html
scripts.js
comprobarCampo.php

index.html
<div><input id="campo" type="text" value=""> <label id="mensaje"></label></div>

scripts.js

var READY_STATE_UNINITIALIZED=0;
var READY_STATE_LOADING=1;
var READY_STATE_LOADED=2;
var READY_STATE_INTERACTIVE=3;
var READY_STATE_COMPLETE=4;
 
var peticion_http;
 
function enviaPeticion(url, metodo, funcion) {
 peticion_http = inicializa_xhr();
 var parms = "campo=" + encodeURIComponent(document.getElementById("campo").value);
 if(peticion_http) {
 peticion_http.onreadystatechange = funcion;
 peticion_http.open(metodo, url, true);
 peticion_http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 peticion_http.send(parms);
 }
}
 
function inicializa_xhr() {
 if(window.XMLHttpRequest) {
 return new XMLHttpRequest();
 }
 else if(window.ActiveXObject) {
 return new ActiveXObject("Microsoft.XMLHTTP");
 }

 	}
 	 	
function muestraResultado() {
 if(peticion_http.readyState == READY_STATE_COMPLETE) {
 if(peticion_http.status == 200) {
 if(peticion_http.responseText == '1')
 {
 document.getElementById("mensaje").innerHTML='Existe';
 }
 else
 {
 document.getElementById("mensaje").innerHTML='No existe';
 }
 }
 }
}
 
function compruebaCampo() {
 enviaPeticion("comprobarCampo.php", "POST", muestraResultado);
}




comprobarCampo.php


La validaci贸n es simb贸lica. En este c贸digo es donde conectaremos con una base de datos para validar nuestro valor. Si quieres saber como conectar con una base de datos con php puedes ver Conectar a una base de datos MySql desde php. Tambi茅n se pueden comparar las cadenas de formas diferentes, por ejemplo con strcmp Basics:Comparar cadenas de texto en php con strcmp().

if ($_POST['campo']=="WikiCode") {
 echo '1';
 }
 else
 {
 echo '0';
 }
 


caras-wtf-whatsApp web


Y listo, f谩cil no?