No dejen de darme sus observaciones para mis nuevos trabajo que estoy culminando como es
- www 100porcientoperu.com/indexBETA.php
- www llamagas.com.pe
Bueno a continuación les presento mi pequeña mejora y como se utiliza, como veran pueden usar tanto los dos métodos GET y POST con este objeto e incluso pueden setear la imagen que aparecerá cuando se esté cargando la información.
Esta solución consiste en cuatro archivos.
- index.php - El cual va ser la página principal que va ver el usuario
- conf.php - Configuración de conexión de datos
- buscar.php - que contiene la rutina de búsqueda y paginación y que va devolver el AJAX a index.php
- AjaxConn.js - Libreria JavaScript que contiene la definición del objeto AJAXConn
PROVECHO !!!!!
index.php
Código HTML:
<? include_once ("conf.php"); $kon = mysql_connect ($host, $usr, $pwd) or die ("Error de Conexion"); mysql_select_db ($bdatos, $kon) or ("Error al conectar a la bdatos"); $sql = mysql_query($busqueda, $kon) or die("Error de busqueda"); $total_registros = mysql_affected_rows(); $total_paginas = ceil($total_registros / $TAMANO_PAGINA); ?><html> <head> <meta name='Author' content="ElíasBG ([email protected])" /> <meta content="no-cache" http-equiv="Pragma" /> <meta content="no-cache" http-equiv="Cache-Control" /> <meta http-equiv="Expires" Content="0" /> <script type="text/javascript" language="javascript" src="AjaxConn.js"></script> <script> var myAjax = new AJAXConn("resultado", "<img src='loading_ani2.gif'/>"); if (!myAjax) alert("XMLHTTP no está disponible. Actualiza tu navegador Internet."); function paginar(pag) { myAjax.connect("buscar.php", "GET", "pagina="+pag); } </script> <link href="style.css" rel="stylesheet" /> </head> <body> <h1>Paginación con AJAX</h1> <p class="link">Hola amigos por ahi encontré una rutina de conexión a AJAX y bueno traté de mejorarlo, ahora lo he hecho con la capacidad que pueda usarse tanto con el método GET y POST y que sea de uso genérico, ademas la capacidad de usarlo como un objeto y parametrizarlo. <br> <br> Saludos... EliasBG </p> <br><? if ($total_paginas > 1){ for ($i=1;$i<=$total_paginas;$i++){ echo "<span class=\"link\" onClick=\"paginar('$i')\">$i</span> "; } }else{ echo "$i "; } ?><br><br> <div id="resultado"> Escoje alguna página para mostrar los resultados </div> <br> </body> </html>
Código PHP:
<?
$host = "localhost";
$usr = "consulta";
$pwd = "seguro";
$bdatos = "bd_sistema";
$TAMANO_PAGINA = 10;
$busqueda = "select * from cliente";
?>
buscar.php
Código PHP:
<?
include_once ("conf.php");
$kon = mysql_connect ($host, $usr, $pwd) or die ("Error de Conexion");
mysql_select_db ($bdatos, $kon) or ("Error al conectar a la bdatos");
$pagina = $_GET["pagina"];
if (!$pagina) {
$inicio = 0;
$pagina=1;
}
else {
$inicio = ($pagina - 1) * $TAMANO_PAGINA;
}
$sql = mysql_query($busqueda, $kon) or die("Error de busqueda");
$total_registros = mysql_affected_rows();
$total_paginas = ceil($total_registros / $TAMANO_PAGINA);
$sql = mysql_query($busqueda . " LIMIT $inicio, $TAMANO_PAGINA;", $kon);
echo "<table cellpadding='1' cellspacing='1' width='100%' border=0>";
$color='#FFFFFF';
while ($row = mysql_fetch_array($sql)){
echo "<tr bgcolor=$color>";
echo "<td>".$row['CLIE_CODIGO'] . "</td>";
echo "<td>".$row['CLIE_NOMBRE1'] . "</td>";
echo "<td>".$row['CLIE_NOMBRE2'] . "</td>";
echo "<td>".$row['CLIE_APELLIDO1'] . "</td>";
echo "<td>".$row['CLIE_APELLIDO2'] . "</td>";
echo "</tr>";
$color=($color=="#99CCFF"?"#FFFFFF":"#99CCFF");
}
echo "</table>";
echo "<b>Total Registros: " . $total_registros . "<br>";
echo $TAMANO_PAGINA . " registros cada una<br>";
echo "Página " . $pagina . " de " . $total_paginas . "</b><br/>";
mysql_close ($kon);
?>
Nota: por siaca es código JavaScript, solo lo he puesto asi para que se vea bonito
Código PHP:
/** AjaxConn - Simple XMLHTTP Interface - [email protected] - 17/Feb/2006
** Código Liberado por: Elías Barrientos García
** página: eliasbg.dynalias.com/AJAX/paginacion
** weblog: eliasbg.blogspot.com
**/
function AJAXConn(sDestino, sCargando)
{
var xmlhttp, bCompleto = false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (excepcion) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (excepcion) {
try {
xmlhttp = new XMLHttpRequest();
}
catch (excepcion) {
xmlhttp = false;
}
}
}
if (!xmlhttp) return null;
this.connect = function(sURL, sMetodo, sVars) {
if (!xmlhttp) return false;
bCompleto = false;
sMetodo = sMetodo.toUpperCase();
try {
if (sMetodo == "GET") {
xmlhttp.open(sMetodo, sURL+"?"+sVars, true);
sVars = "";
}
else {
xmlhttp.open(sMetodo, sURL, true);
xmlhttp.setRequestHeader("Method", "POST "+sURL+" HTTP/1.1");
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
}
xmlhttp.onreadystatechange = function(){
// Estado del Objeto: //
ST_UNINITIALIZED = 0;
ST_LOADING = 1;
ST_LOADED = 2;
ST_INTERACTIVE = 3;
ST_COMPLETE = 4;
if (xmlhttp.readyState == ST_LOADING) {
document.getElementById(sDestino).innerHTML = sCargando;
}
if (xmlhttp.readyState == ST_COMPLETE && !bCompleto) {
bCompleto = true;
document.getElementById(sDestino).innerHTML = xmlhttp.responseText;
}
};
xmlhttp.send(sVars);
}
catch(excepcion) {
return false;
}
return true;
};
return this;
}
El motivo por el cual no puedo colocar los enlaces es porque soy nuevo y aun no me permiten en este foro
Saludos
EliasBG
Weblog:eliasbg.blogspot.com
Página:eliasbg.dyndns.org/AJAX/paginacion