Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/02/2006, 12:26
Avatar de EliasBG
EliasBG
 
Fecha de Ingreso: julio-2005
Mensajes: 10
Antigüedad: 18 años, 9 meses
Puntos: 1
Una Mejor en AJAX a Objetos

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&eacute; una rutina de conexi&oacute;n a AJAX y bueno trat&eacute; de mejorarlo, ahora lo he hecho con la capacidad que pueda usarse tanto con el m&eacute;todo GET y POST y que sea de uso gen&eacute;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&aacute;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(sDestinosCargando)
{
    var 
xmlhttpbCompleto 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(sURLsMetodosVars)    {
        if (!
xmlhttp) return false;
        
bCompleto false;
        
sMetodo sMetodo.toUpperCase();

        try {
              if (
sMetodo == "GET") {
                
xmlhttp.open(sMetodosURL+"?"+sVarstrue);
                
sVars "";
              }
              else {
                
xmlhttp.open(sMetodosURLtrue);
                
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

Última edición por EliasBG; 23/02/2006 a las 13:57