gepser/ConsultaAjax.html

## ConsultaAjax.html
<html>
<head>
<script>
function loadXMLDoc()
{
	var xmlhttp;
	var pal;

	//Campo de Texto que tendrá la plabra o dígito que deseemos enviar como parámetro para consultar
	pal = document.getElementById("txtPalabraBusqueda").value

	//GIF para el loader mientras se espera
	document.getElementById("divAjax").innerHTML="<center><img src='/ajax-loader.gif'></center>";

		if (window.XMLHttpRequest)
		{
		xmlhttp=new XMLHttpRequest();
		}
		else
		{
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
		}
		xmlhttp.onreadystatechange=function()
		{
		if (xmlhttp.readyState==4 && xmlhttp.status==200)
		  {
		  //Div que se actualizará con la respuesta de la página secundaria
		  document.getElementById("divAjax").innerHTML=xmlhttp.responseText;
		  //Acá se puede llamar una segunda función AJAX para que se ejecute hasta que esta termine, es decir en cascada.
		  //segunda_funcion_ejemplo();
		  //En esa otra función que sería similar a esta se puede llamar a una tercera y así sucesivamente para hacer la cascada de funciones tan grande como sea necesario.

		  }
		}
		//En la página secundaria se harán consultas a la Base de Datos o cualquier cálculo y lo regresamos con un Response.Write
		xmlhttp.open("GET","ajxPaginaSecundaria.asp?pal=" + pal,true); //asp es sólo un ejemplo, podría ser php o cualquier página de cualquier lenguaje de servidor
		xmlhttp.send();

}

//Para hacer la consulta AJAX cuando se presione ENTER (dentro del input porque está en un OnKeyPress)
function pulsar(e) {
  tecla = (document.all) ? e.keyCode :e.which;
  if (tecla==13){
	loadXMLDoc()
	return (tecla!=13)
  }
}

</script>
</header>
<body>

<table width="100%" align="center" border="0">
	<tr>
		<td>
			TITULO
		</td>
	</tr>
</table>

<form id="frmConsulta" name="frmConsulta">
  <table align="center">
    <tr>
			<td>Palabra</td>
			<td>
				<input type="text" id="txtIncidente" name="txtPalabraBusqueda" maxlength="15" onkeypress="return pulsar(event)">
			</td>
	</tr>
	<tr>
      <td colspan="2" align="center">
    		<p>&nbsp;</p>
    		<input type="button" value="Consultar" onclick="loadXMLDoc()">
      </td>

    </tr>
  </table>
</form>

<div id="divAjax"></div>
</body>
</html>
	<html>
	<head>
	<script>
	function loadXMLDoc()
	{
	var xmlhttp;
	var pal;

	//Campo de Texto que tendrá la plabra o dígito que deseemos enviar como parámetro para consultar
	pal = document.getElementById("txtPalabraBusqueda").value

	//GIF para el loader mientras se espera
	document.getElementById("divAjax").innerHTML="<center><img src='/ajax-loader.gif'></center>";

	if (window.XMLHttpRequest)
	{
	xmlhttp=new XMLHttpRequest();
	}
	else
	{
	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
	xmlhttp.onreadystatechange=function()
	{
	if (xmlhttp.readyState==4 && xmlhttp.status==200)
	{
	//Div que se actualizará con la respuesta de la página secundaria
	document.getElementById("divAjax").innerHTML=xmlhttp.responseText;
	//Acá se puede llamar una segunda función AJAX para que se ejecute hasta que esta termine, es decir en cascada.
	//segunda_funcion_ejemplo();
	//En esa otra función que sería similar a esta se puede llamar a una tercera y así sucesivamente para hacer la cascada de funciones tan grande como sea necesario.

	}
	}
	//En la página secundaria se harán consultas a la Base de Datos o cualquier cálculo y lo regresamos con un Response.Write
	xmlhttp.open("GET","ajxPaginaSecundaria.asp?pal=" + pal,true); //asp es sólo un ejemplo, podría ser php o cualquier página de cualquier lenguaje de servidor
	xmlhttp.send();

	}

	//Para hacer la consulta AJAX cuando se presione ENTER (dentro del input porque está en un OnKeyPress)
	function pulsar(e) {
	tecla = (document.all) ? e.keyCode :e.which;
	if (tecla==13){
	loadXMLDoc()
	return (tecla!=13)
	}
	}

	</script>
	</header>
	<body>

	<table width="100%" align="center" border="0">
	<tr>
	<td>
	TITULO
	</td>
	</tr>
	</table>

	<form id="frmConsulta" name="frmConsulta">
	<table align="center">
	<tr>
	<td>Palabra</td>
	<td>
	<input type="text" id="txtIncidente" name="txtPalabraBusqueda" maxlength="15" onkeypress="return pulsar(event)">
	</td>
	</tr>
	<tr>
	<td colspan="2" align="center">
	<p> </p>
	<input type="button" value="Consultar" onclick="loadXMLDoc()">
	</td>

	</tr>
	</table>
	</form>

	<div id="divAjax"></div>
	</body>
	</html>