Hola,
Estoy empezando con ajax y php y me da el siguiente error
Se ha producido un error al obtener los datos
readyState:1
status: 0
headers: null
Os adjunto mi codigo:
El fichero ejercicio1a.php
Código HTML:
<html>
<head>
<script language="javascript" src="./ajax.js" type=text/javascript></script>
<script type="text/javascript">
//Validacion de numero
function isNumero(num){
if(/^([0-9])*$/.test(num)) {
return true;
}else{
return false;
}
}
function cargarTablaMultiplicar() {
var form = document.getElementById('formularioMultiplicar');
var numero = form.numero.value;
if(numero!='' && isNumero(numero)){
var url ='<?php echo $HTTP_REFERER ?>' +'tablaMultiplicarAjax.php?numero='+numero;
//"application/x-www-form-urlencoded"
new net.CargadorContenidos (url, muestraContenido, null, 'GET', null,null);
}else{
alert('Debe introducir un numero');
}
}
function muestraContenido () {
var divTabla = document.getElementById('tablaMultiplicar');
divTabla.innerHTML = this.req.responseText;
}
function limpiarFormulario() {
var form = document.getElementById('formularioMultiplicar');
form.reset();
var divTabla = document.getElementById('tablaMultiplicar');
divTabla.innerHTML = "";
}
</script>
<title>Ejercicio 1</title>
</head>
<body>
<center>
<form method="get" id="formularioMultiplicar">
Numero: <input type="text" name="numero" ></br></br>
<a href="javascript:cargarTablaMultiplicar();">Obtener tabla de multiplicar</a>
<a href="javascript:limpiarFormulario();">Limpiar</a>
</form>
<div id="tablaMultiplicar"></div>
</center>
</body>
</html> El fichero ajax.js
Código HTML:
var net = new Object();
net.READY_STATE_UNINITIALIZED=0;
net.READY_STATE_LOADING=1;
net.READY_STATE_LOADED=2;
net.READY_STATE_INTERACTIVE=3;
net.READY_STATE_COMPLETE=4;
// Constructor
net.CargadorContenidos = function(url, funcion, funcionError, metodo, parametros,contentType) {
this.url = url;
this.req = null;
this.onload = funcion;
this.onerror = (funcionError) ? funcionError : this.defaultError;
this.cargaContenidoXML(url, metodo, parametros, contentType);
};
net.CargadorContenidos.prototype = {
cargaContenidoXML: function(url, metodo, parametros, contentType) {
if(window.XMLHttpRequest) {
this.req = new XMLHttpRequest();
}else if(window.ActiveXObject) {
this.req = new ActiveXObject("Microsoft.XMLHTTP");
}
if(this.req) {
try {
var loader = this;
this.req.onreadystatechange = function() {
loader.onReadyState.call(loader);
};
this.req.open(metodo, url, true);
if(contentType) {
this.req.setRequestHeader("Content-Type", contentType);
}
this.req.send(parametros);
} catch(err) {
this.onerror.call(this);
}
}
},
onReadyState: function() {
var req = this.req;
var ready = req.readyState;
if(ready == net.READY_STATE_COMPLETE) {
var httpStatus = req.status;
if(httpStatus == 200 || httpStatus == 0) {
this.onload.call(this);
}
else {
this.onerror.call(this);
}
}
},
defaultError: function() {
alert("Se ha producido un error al obtener los datos"
+ "\n\nreadyState:" + this.req.readyState
+ "\nstatus: " + this.req.status
+ "\nheaders: " + this.req.getAllResponseHeaders());
}
};
Y el fichero de recarga tablaMultiplicarAjax.php
Código HTML:
<center>
<?php
$metodo=$_SERVER['REQUEST_METHOD'];
echo "<h2>Tabla del $_GET[numero] </h2>";
for($i=1;$i<=10;$i++){
$resultado=$i*$_GET[numero];
echo "<b>$_GET[numero] x $i = $resultado</b></br>";
}
?>
</center> Gracias