LÍNEAS DE
ACCIÓN:
Universidad CAPECE
AREAS DE ESTUDIO
INICIAR SESIÓN

Correo:



iniciar Sesion


CALENDARIO DE EVENTOS
Calendario de eventos

CAPECE EN IMÁGENES
CAPECE en imagenes ACTUALIDAD Y NOVEDADES DEL COMERCIO ELECTRÓNICO EN EL PERÚ
ver mas
INFORMACIÓN
SERVICIOS EN LINEA


CAPECE RECOMIENDA
ENCUESTA

Includes dinámicos con PHP y AYAX

Bueno todo sabemos el famoso include dinamico donde enviando un parametro por el url, incluimos un archivos en la pagina PHP, de esta manera cambiando el contendio. Pero que tal si ahora lo hacemos con AJAX?

El include dinamico normal con PHP es efectivo por:
1- Simplicidad para los Webmasters, ya que no tienen que repetir el diseño sino llevan una simple estructura y cambian por contenido
2- Página menos cargada

Ahora, que mejor manera de sacarle provecho a AJAX que hacer un include dinamico de PHP, de esta manera la pagina no hacer refresh sino la zona que lleva el contenido o include hara el cambio. Empecemos:

 

 

PHP

Lo primero que haces es crear nuestro archivo PHP que lleva el include. De esta manera cuando el archivo corra nos trae el contenido y con el actualizamos la zona dinamica de la página.

include.php Codigo:

   
$pagina = addslashes((string) $_GET['variable']);

if(!isset($pagina))
{
    include('main.php');
}
else if ((string) $pagina && is_string($pagina))
{
 if(file_exists('.$page.'.php'))
 {
       include('.$page.'.php');
 }
 else
 {
       die("que paso bitch");
 }
}

?>

hola.php Codigo:

    hola como tut a bien bien

//simplemente soy el archivo que se va incluir

?>

 

 

Java Script

Bueno ahora la parte de AJAX, utilizaremos la libreria XHConn.js de la cual ya he comentado anteriormente, de esta forma nos sale mas facil hacer el script.

Lo unico que debemos hacer es agregar este codigo:
Code:


<script type="text/javascript" language="javascript" src="XHConn.js"></script>
 <script>
 //inicializamos la libreria
 var myConn = new XHConn();
 
 //si no existe da error
 if (!myConn) alert("XMLHTTP no disponible. Intenta un mejor browser.");
 
 //funcion que se llama luego del include
 var include_terminado = function (oXML) { document.getElementById('include').innerHTML = oXML.responseText; };
 
 //funcion que hace el include
 function include_dinamico (url)
 {
  //que hace mientras esta corriendo el script, pone una imagen de loading
  document.getElementById('include').innerHTML = "<img src='loading_ani2.gif' />";
 
  //AJAX, llamo a la pagina y le mando los parametros
  myConn.connect("include.php", "GET", "variable="+url, include_terminado);
 }
 </script>
 

    

Uniendo todo

Ahora tenemos nuestro script de PHP y nuestra funcion de AJAX, ¿Que nos Falta? Bueno ya es simple, es solo unirlo todo.

el archivo index.php o index.htm Code:

 <html>
 <head>
 <script type="text/javascript" language="javascript" src="XHConn.js"></script>
 <script>
 //inicializamos la libreria
 var myConn = new XHConn();
 
 //si no existe da error
 if (!myConn) alert("XMLHTTP no disponible. Intenta un mejor browser.");
 
 //funcion que se llama luego del include
 var include_terminado = function (oXML) { document.getElementById('include').innerHTML = oXML.responseText; };
 
 //funcion que hace el include
 function include_dinamico (url)
 {
  //que hace mientras esta corriendo el script, pone una imagen de loading
  document.getElementById('include').innerHTML = "<img src='loading_ani2.gif' />";
 
  //AJAX, llamo a la pagina y le mando los parametros
  myConn.connect("include.php", "GET", "variable="+url, include_terminado);
 }
 </script>
 </head>
 <body>
 Bueno esto es una prueba y lo k tu kieras <a href="#" onclick="include_dinamico('hola');">Link</a>
 
 <!-- Aki va el contenido k va a ser remplazado por AJAX -->
 <div id="include">
 Entraste a la pagina y aki es k va el include
 </div>
 </div>
 </body>
 </html>
 

*Nota: No influye si es un index.php o index.htm

Guardamos nuestro include.php en el mismo folder que esta nuestro index y la libreria de AJAX igual.

Con esto ya terminamos, espero que sea de ayuda cualquier consulta esta el foro y aqui les dejo todo para que los descargen.

 

Desventajas

 

Nada es perfecto, ¿que no tiene de perfecto? Aunque es funcional, impresionaria a los usuarios y es poco codigo tienes estas desventajas.

1- No Bookmarks: ya que el url no cambia sino que siempre se queda en index.php los usuarios no podran una pagina en la que se quedaron.

2- No Botton de Back: tus usuarios no podran hacer back, sino que debes tener un buen panel de navegación

3- Refresh vuelve al Inicio: si el usuario da refresh vuelve al inicio  
 

 

 

   
Nuestras cámaras de comercio electrónico hermanas
Copyright © 2011
Todos los derechos reservados
Contacto:
(+511) 431.0885
Desarrollado por: