Despues de varios dias de trabajo sin parar, puedo entrar al foro para contarles que estuve viendo algo de
AJAX y bueno le metí mano e hice
unas mejoras para su uso, tales como, convertirlo todo en un
objeto AJAXConn y con la instacia del objeto que he creado y setear algunas propiedades esta listo para operar
No dejen de darme sus observaciones para mis nuevos trabajo que estoy culminando como es
- www 100porcientoperu.com/indexBETA.php
- www llamagas.com.pe
Nota: falta el punto despues de las WWW
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>
conf.php 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);
?>
AjaxConn.js 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;
}
Su funcionamiento pueden verlo aqui: eliasbg.dyndns.org/AJAX/paginacion
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