You are on page 1of 22

Programación PHP orientada a objetos, con separación por capas y Smarty.

Tutorial 1
Programación PHP orientada a objetos, con separación por capas y Smarty. A continuación veremos el primer tutorial de programación php de una serie de muchos tutoriales, que explicara detalladamente “una forma” “mi forma” de programar tanto páginas web, como software y herramientas para la web. El gran problema en el mundo actual en el desarrollo de software y de webs en php, es que cada quien programa “como se le da la gana” no hay una serie de lineamientos ni bases que permitan rehusar fácilmente el código de otro programador en nuestros trabajos, muchas veces ni siquiera podemos rehusar nuestro propio código y repetimos varias veces las mismas líneas y los mismos pedazos de códigos, por lo cual muchas veces es mas el tiempo que gastamos intentando reconstruir el código de otras personas, que el tiempo que hubiésemos gastado creando una pieza o herramienta desde 0 sin mirarle a nadie. Además de no entender el código ni la forma de programar de los demás, otra gran desventaja es que el trabajo en equipo se vuelve muy complicado y al final una sola persona termina desarrollando todo el producto; por lo cual seguir un mismo lineamiento se vuelve supremamente efectivo para el desarrollo en equipo y para comprender todas las extensiones del php. Otro gran problema en el desarrollo php, es que los programados tienden a hacer del código un “vomito” juntan diferentes lenguajes en un solo archivo, juntan php con html, php con javascript, con css, con consultas sql con ajax y el código aunque funciona se vuelve perversamente inentendible. Por lo tanto he decidido explicar un método que junto con un profesor de la universidad nacional de Colombia (Fernando Arango) y un grupo de programadores php, hemos venido desarrollando durante los últimos años. Anteriormente para desarrollar una página o software me podía demorar varios meses, hoy en día con estos métodos en cuestión de 1 o 2 semanas o incluso días se tendrá lista una página o software. 1) ¿Por qué usar PHP?

Porque todos los navegadores lo traen instalado, no es como java o c++ donde necesitas instalar en cada computador ese programa y verificar que si funcione; porque indexa muy bien en los buscadores, rápidamente se difunde en la web y hace que nuestras páginas aparezcan ahí; porque está muy bien documentado existen miles y miles de tutoriales en la web y ha mostrado muy buen desempeño y es un lenguaje de fácil entendimiento además de que se integra muy bien con otros lenguajes como javascript, css, entre otros. 2) ¿Que es la separación por capas? La separación por capas, son una serie de reglas, una serie de divisiones que se le da al código, más adelante se detallara muy bien este punto; el caso es que vienen a ser unos “mandamientos” que se deben cumplir para garantizar un código reutilizable funcional y al que se le puede hacer mantenimiento. En el caso más simple la separación por capas viene dada del siguiente modo: 2.1) Capa gestor: es la capa en la cual va la conexión a la base de datos y todas las consultas y funciones que adicionan, editan, eliminan o recuperan datos de la base de datos; en nuestro caso será un archivo llamado gestor.php 2.2) Capa controlador: es la capa intermedia que manda peticiones y datos a la capa gestor y que decide que es lo que se muestra por pantalla y que no se muestra. En nuestro caso sería por ejemplo un index.php en este capa jamás ira un código html. 2.3) Capa vista: es la capa que muestra los datos por pantalla, son los templates o archivos html, se conectan solo con la capa controlador, jamás se pueden conectar con la capa gestor, aquí NUNCA abra una sola línea de código php, siempre será html, y además se complementara con Smarty que mas adelante analizaremos que es. Muchas veces entre la capa del controlador y gestor se agrega la capa objetual, pero vamos a ver qué dependiendo del programa es o no necesaria, por el momento olvidémonos de este capa y trabajemos solo con las 3 capas anteriores. Más adelante mostraron un ejemplo muy sencillo del funcionamiento de estas capas, para darle mayor comprensión al programador. 3) ¿Que es Smarty? Smarty es la herramienta clave para poder hacer la separación por capas, simplemente permite al programador separa el código php del html y usar una serie de etiquetas smarty; es un lenguaje supremamente sencillo, y en mi opinión en vez de complicar las cosas (porque algunos

por lo cual se sugiere no abrir estos simultáneamente. Se descarga desde aquí: http://www. vbulletin o cualquier paquete para hacerla? muchas veces la gente lo usa creyendo que ahorrara tiempo. por lo cual es muy importante hacer lo siguiente. todos los desarrollos php que se vayan a hacer deben ir en la carpeta c://wamp/www/ en ese directorio deberán crear una carpeta por cada pagina o desarrollo. montar nuestros trabajos php y verlos en funcionamiento. que desarrollándolos desde cero. pero realmente se demora mas entendiendo esos códigos e intentando modificarlo o buscando plugins.php Una vez instalado deben tener en cuenta. mas adelante creare un tutorial de como hacer blogs o cosas avanzadas que en realidad son muy sencilla y nos harán sentir orgullosos de nuestros trabajos En el próximo tutorial que estoy creando. wordpress. mas adelante veremos los tips o claves de nuestro método de programación.piensan que manejar otro lenguaje es complicar las cosas) facilita tremendamente que el código sea más claro y más sencillo. métodos y funciones. Tutorial 2 WampServer Wampserver es el programa que nos permitirá hacer de nuestro computador un “servidor”. un blog básico es algo muy sencillo de hacer y yo me demore 4 días creándolo desde cero. Es importante tener en cuenta que wampserver aveces presenta conflictos con skype.com/en/download. luego pararse en la carpeta PHP y dar clic en php. mientras que tratando de modificar un joomla me demore semanas y abandone esa opción. 5) ¿Crear todo desde cero? Claro que si si le vas a desarrollar una web a alguien y te van a pagar entonces ¿Porque usar joomla. 4) ¿Que es programación orientada a objetos? Es simplemente una forma de programar donde se usan clases. Wampserver. dar clic en el icono de wampserver en la barra de inicio.wampserver. veremos ahora si un ejemplo de un código del desarrollo mas básico de un programa con nuestro método. Otra cosa es que el wampserver es muy escandaloso con los warnings o alertas. y dentro de esa carpeta deberán montar todos los archivos de su desarrollo.ini .

C://wamp/www/trabajo/varios/ Las carpetas cache. 3) Descargamos smarty desde aquí: http://www. el gestor.C://wamp/www/trabajo/templates/ . Nota (Regla): nunca crear nombres de carpetas o archivos empezando con mayuscula.net/download Una vez descargado lo descomprimimos y ojo! Entramos a la carpeta libs y TODO lo que hay ahí (dentro de la carpeta libs) lo copiamos y lo pegamos dentro de la carpeta . configs. aveces general problema al llamar archivos o carpetas desde otros lugares por la bendita mayuscula 1) Creamos una carpeta llamado trabajo en la ruta C://wamp/www/ 2) Dentro de esta carpeta crearemos las siguientes carpetas: . deben buscar la línea error_reporting = E_ALL y sustituirla por error_reporting = E_ALL & ~E_NOTICE Lo ultimo es reiniciar el wampserver y ya estará listo para trabajar. tempaltes_c son de uso exclusivo para smarty. archivos de estilo y muchas otras cosas. templates.smarty. un ejemplo Como lo dijimos en un tutorial pasado “Smarty es la herramienta clave para poder hacer la separación por capas. Tutorial 3 Que es Smarty y como usarlo. en la carpeta images guardaremos mas adelante todas las imágenes. un ejemplo. nunca usar mayuscula siempre minuscula.C://wamp/www/trabajo/smarty/ . Que es Smarty y como usarlo. smarty.C://wamp/www/trabajo/images/ . guardaremosmas adelante archivos de javascript. y en la carpeta varios.C://wamp/www/trabajo/configs/ . simplemente permite al programador separa el código php del html y usar una serie de etiquetas smarty” Una vez instalado el wampserver.C://wamp/www/trabajo/cache/ . vamos a hacer nuestro primer desarrollo con smarty.C://wamp/www/trabajo/templates_c/ .Esto abrirá un archivo en bloc de notas.php.

5) creamos un archivo index.class.php'). $smarty->cache_dir = 'C:/wamp/www/trabajo/cache'. el directorio de templates_c que será donde se ubiquen los cache de los templates “pre” cargados para que la pagina cargue mas rápido y muchas otras cosas que en otros tutoriales explicaremos.En la tercera línea incluimos la clase smarty la cual es esencial para todo el proyecto.En el resto de las líneas definimos los directorios smarty donde se va a ubicar información clave. class index { . . include_once('C:/wamp/www/trabajo/smarty/Smarty.php en esta ruta: C://wamp/www/trabajo/include.php'). $smarty->compile_dir = 'C:/wamp/www/trabajo/templates_c'.'http://localhost/trabajo/'). $smarty->template_dir = 'C:/wamp/www/trabajo/templates'. ?> Lo anterior indica lo siguiente: Definimos una variable RUTA que es la ruta vía web de nuestro proyecto “trabajo”.C://wamp/www/trabajo/smarty/ esos son los archivos necesarios. $smarty->config_dir = 'C:/wamp/www/trabajo/configs'. $smarty = new Smarty.php con lo siguiente: <?php define ('RUTA'. por ejemplo definimos el directorio template_dir en la carpeta templates lo cual indica que ahí irán todos los archivos html.php que será el controlador y el primer archivo que manejara la información <?php //cargamos las librerías de smarty require('include.En la cuarta línea creamos un nuevo objeto tipo smarty. el resto de archivos que trae ese comprimido no son necesarios son ejemplos o demos de smarty 4) Crearemos un archivo llamado include. . .

incluimos el archivo que anteriormente creamos.public function display() { global $smarty.php y luego salta hasta el final de la definición de la clase.tpl) 6) Creamos el archivo hola.tpl y que debe estar ubicado en C://wamp/www/trabajo/templates/hola. que indica que cogerá el objeto smarty que creamos en el include (debe ser global porque no está definida dentro de la clase.tpl en la ubicación C://wamp/www/trabajo/templates/hola.tpl . $call->display().tpl o . .php y que es el directorio “templates” en este caso coge un archivo llamado hola. } } $call = new index().En la línea de require. .php $call = new index(). si no fuera de la clase) y por ultimo usando este objeto smarty usamos una función de smarty llamada display que lo que hace es que muestra por pantalla algún archivo .html (son lo mismo) que se debe encontrar ubicado dentro del directorio de template que definimos anteriormente en include.En la línea de class creamos una clase llamada index (todos los controladores se sugieren que sean clases para seguir el mismo lineamiento en todos los archivos y que sea de fácil manejo) .Por ultimo cuando entramos desde el navegador a http://localhost/trabajo/index. esa función tiene la línea global smarty. y seguidamente llama la función display y ejecuta lo que hay allí dentro (mostrando finalmente lo que hay dentro de hola. si no que lee la línea donde se incluye el include.tpl el cual crearemos enseguida. ?> Lo anterior indica lo siguiente: . y lee la línea donde creamos un nuevo objeto tipo index.tpl').php el navegador NO lee lo que hay por dentro de la clase.En la línea de public function display lo que hacemos es que crearemos una función que será característica de todos los controladores que es donde decidimos que mostrar por pantalla en este caso. //Muestra por pantalla todos los diferentes templates $smarty->display('hola.

<html> <title></title> <body> hola </body> </html> Este archivo simplemente muestra un mensaje de hola 7) entramos al navegador a esta pagina http://localhost/trabajo/index. el resto será repetir este proceso varias veces e ir agregando cosas. Aunque parece algo muy bobo y un poco complicado. son los primeros pasos muy muy escensiales para una buena programación php. Tutorial 4 Phpmyadmin. y en los 2 próximos tutoriales siguientes vamos a aprender a llenar la información de esta tabla desde un proyecto php y vamos a aprender a manejar el gestor de base de datos el cual es fundamental para todo desarrollo. creación de una base de datos y tabla. creación de una base de datos y tabla Es muy importante que toda la información este almacenada en una base de datos por cuestiones de seguridad. Lo primero que debemos hacer es abrir wampserver y luego entrar a http://localhost/phpmyadmin/ seguidamente dar clic en privilegios y a continuación dar clic en agregar un nuevo usuario después colocamos: Nombre de usuario: prueba Servidor: y de la lista desplegable que hay lado seleccionamos “Local” Contraseña: prueba . en este tutorial vamos a crear una tabla desde phpmyadmin en wampserver.php y vemos que sale el aviso de hola. Phpmyadmin.

y en este caso el documento será INT que son números enteros. en nuestro caso crearemos una tabla que se va a llamar persona y que va a tener 3 campos. los otros 2 campos serán tipo texto (varchar) y tendrán una máxima longitud de 100 caracteres. un nombre y un apellido. como sabemos no pueden existir 2 personas con un mismo documento. En la parte izquierda nos aparecerá el nombre de la base de datos (prueba) damos clic ahí. y luego procedemos a crear una tabla.Y finalmente chuleamos la opción “Crear base de datos con el mismo nombre y otorgue todos los privilegios”. el documento será la clave primaria. la clave primaria es aquella que identifica o diferencia una persona de otra. Por último damos clic en Grabar y ya tenemos creado nuestra primera tabla y nuestra primera base de datos. Entonces colocamos lo anterior: Nombre: persona Numero de campos: 3 Seguidamente procederemos a llenar los datos como muestra la imagen: a la persona simplemente le colocaremos un documento. en el próximo tutorial veremos cómo es el manejo del gestor y más adelante insertaremos datos desde una página web a esa base de datos. Por ultimo clic en continuar y ya tenemos creada nuestra primer base de datos (prueba) y tenemos asignado un usuario con el mismo nombre (prueba). . Es FUNDAMENTAL que todas las tablas que se creen sean de tipo InnoDB esto nos permitirá más adelante crear claves foráneas (las cuales explicaremos en otro tutorial).

if(!mysql_select_db($this->db)) die ( "No fue posible comunicarse con la base de datos $db: ". function gestor(){ } function conectar(){ $this->cn = mysql_pconnect($this->servidor. es un código que actualmente utilizo en TODAS las páginas y/o software que requieren de una base de datos.php <?php class gestor{ var $servidor = "localhost". este archivo deberá ser guardado en C://wamp/www/trabajo/varios/gestor.Gestor de base de datos. eliminar datos. y será el único archivo que tendrá la contraseña y el nombre de la base de datos y servidor. conectar a la base de datos para: guardar datos. var $user = "prueba". Continuando con los tutoriales anteirores.mysql_error()). } . var $pass = "prueba". Este será el UNICO archivo en el cual se colocaran las consultas sql. es un archivo que a pesar de varios años que han pasado no e necesitado modificarlo. var $db = "prueba". Tutorial 5 Gestor de base de datos El gestor de base de datos es un archivo que nos permitirá en todos nuestros proyectos. var $cn. pero las funciones que pegare son las más generales y son demasiado útiles.mysql_error()). $this->pass ). sacar datos y mucho mas. editar datos. Obviamente para cada página y para cada software deberemos agregar funciones adicionales. $this->user. El siguiente código. if ( !$this->cn ) die("Fallo en la conexion a la base de datos: ".

} } ?> Explicacion: Las 4 variables que aparecen en el gestor. son el servidor. } return $datos. el nombre de usuario que debe ser prueba.function realizarOperacion($codigo){ $resultado = mysql_query($codigo. $this->cn) . cada elemento sera un registro $datos = array(). while ( $row = mysql_fetch_object($resultado) ){ array_push($datos. } /**Cierra la conexion a la BD*/ function cerrarConexion(){ if($this->cn) mysql_close( $this->cn ). Funcion consultar: permite sacar datos de la base de datos y los transforma en forma de objeto (mas adelante veremos como los saca y como utilizamos esa información que sacamos) . y el nombre de la base de datos que igual que el usuario es prueba. $this->cn) or die(mysql_error($this>cn)). Funcion conectar: nos permite conectarnos a la base de datos. $row). Funcion realizarOperacion: permite realizar consultas o modificación a la base de datos. que en nuestro caso es localhost. } /**Realiza una consulta sobre la BD*/ function consultar($codigo){ //vector donde se almacenaran los resultados de la consulta. la contraseña que también es prueba. $resultado = mysql_query($codigo.

es FUNDAMENTAL siempre que se haga una conexión. En este caso los pasos son los siguientes: 1) Desarrollar un template el cual tenga un formulario para recolectar el nombre. Gracias a estas funciones en el próximo tutorial podremos realizar nuestra primera inserción a la base de datos para guardar la información de forma segura. vamos a hacer una simple inserción desde un formulario web a la base de datos.tpl .Funcion cerrarConexion: como su nombre lo indica cierra la conexión que se establece con la base de datos. pensar bien las cosas que se van a hacer (los pasos que hay que realizar). usando un solo archivo php (controlador) y continuando con la técnica de separación por capas que se hablo en el primer tutorial. apellido y documento de una persona. antes de empezar a copiar código php. Los pasos son muy sencillo. 2) Desarrollar un controlador. En el desarrollo php es supremamente importante. Codificación 1 Archivo: agregarpersona. y luego se realicen todos los procedimientos necesarios al final cerrar la conexión para no sobrecargar el servidor.tpl – C://wamp/www/trabajo/templates/agregarpersona. y una ves uno tiene bien definido esos pasos podrá seguir con el proceso de codificación. Tutorial 6 Basándonos en los tutoriales pasados. Formulario e inserción de datos en la base de datos método 1 (get y post). desde el cual se llame ese template y en el caso de que ya se haya introducido información se deberá enviar la información al gestor y luego mostrar otro template donde haya un aviso diciendo que la información fue agregada correctamente. 3) Agregarle las funciones de adicionar personas a la base de datos al gestor. Tutorial 6 Formulario e inserción de datos en la base de datos método 1 (get y post). en la tabla persona y en el gestor de datos.

<html> <title></title> <body> <table border="0" cellspacing="10"><tr><td> <form action="agregarpersona. y llama el controlador. Cuando el usuario da clic en agregar envía los datos que la persona lleno.$Datos) { . class agregarpersona { public function agregar($Opcion. Codificación 2 Archivo: agregarpersona.php').php'). include ('varios/gestor. encargarse del envió de datos y mostrar mensajes.tpl (es muy importante utilizar nombres acordes a lo que hace cada cosa) todos los formularios deben ser tipo POST ya que por ahí la información viaja mas protegida. Y el resto son simplemente los campos que el usuario deberá llenar. para estas cosas. mucha gente utiliza varios controladores o archivos php.php – C://wamp/www/trabajo/agregarpersona. eso es muy ineficiente y lo único que hace es complicar la lógica de la programación y aumentar las líneas de código. enseguida observaremos que un mismo controlador puede mostrar el template del formulario.php <?php //cargamos las librerías de smarty require('include.php?opcion=agregar" name="agregarpersona" method="post"> <b>Documento:</b> <input type="text" name="documento" /><br /> <b>Nombre:</b> <input type="text" name="nombre" /><br /> <b>Apellido:</b> <input type="text" name="apellido" /><br /> <input type="submit" value="Agregar" /> </form> </td></tr></table> </body> </html> El template lo llamaremos agregarpersona.

$gestor->agregar('persona'. $TemplateAuxiliar = 'mensaje. //Muestra por pantalla todos los diferentes templates $smarty->display($TemplateAuxiliar).'Persona agregada correctamente').$Datos).$Datos). $smarty->assign('mensaje'. $call = new agregarpersona(). switch($Opcion) { case "agregar": $gestor = new gestor(). //guarda los datos enviados en una nueva conexion $Datos = $_POST. $call->agregar($Opcion. } } //guarda el tipo de accion que se desea realizar $Opcion = $_GET['opcion']. $TemplateAuxiliar. . $TemplateAuxiliar ='agregarpersona. $TemplateAuxiliar. $gestor->conectar(). $call->display(). } } public function display() { global $smarty.global $smarty.tpl'. break. default: break.tpl'. $gestor->cerrarConexion().

y enviara los datos para q sean agregados. Aquí viene un truco.php – C://wamp/www/trabajo/varios/gestor. en caso contrario creara un objeto tipo gestor. luego crea una variable template auxiliar que luego miraremos para que sirve.php la variable opción estará vacia por lo cual en la función agregar ira al default donde no hace nada. lo primero que ejecuta el navegador es la parte donde se llama al include. en caso de que la persona entre por primera ves al archivo agregarperosna.tpl <html> <title></title> <body> <table border="0" cellspacing="10"><tr><td> <b>Aviso</b><br /> {$mensaje} </td></tr></table> </body> </html> Codificación 3 Agregar al Archivo: gestor.php (para encontrar el archivo completo ver tutorial 5) . es simplemente por referencia. lamara la función agregar. y por ultimo crea un objeto agregarpersona y llama la función agregar. luego guarda la opción que se manda por get.tpl para que vean su sencillez Archivo: mensaje. Finalmente se ejecutara la función display y mostrara un template dependiendo del caso. el template auxiliar se cambia a mensaje.tpl pero ahora se cambia porque ya sabemos que en este caso se agrego una persona y mostrara simplemente un mensaje que se asigna con smarty diciendo que la persona se agrego satisfactoriamente. y los datos por post. Adicionalmente adjunto el archivo mensaje.php y además incluye el gestor para futuras operaciones. por defecto al principio estaba en agregarpersona.tpl.?> Como podemos ver he llamado la clase igual al nombre del controlador. en esta función se detecta si se recibió algo por get o no.tpl – C://wamp/www/trabajo/templates/mensaje.

simplemente coge los datos que se enviara. y finalmente envía la consulta a la base de datos. a cada uno les saca los caracteres extraños con la función mysql_real_escape_string esto para evitar que nos envíen códigos maliciosos o nos quieran hacer una injection sql de la cual hablaremos después. $apellido= mysql_real_escape_string($Datos['apellido']). pero hoy en día ese método de volver a cargar toda una página resulta muchas veces ser . Luego de hacer un experimento podremos observar que claramente en phpmyadmin aparece registrado algún dato que metamos por agregarpersona. en post y get. nombre. } } El código es muy sencillo. Tutorial 7 El método anterior para inserción de datos se basa en volver a cargar un controlador. Tutorial 7 Formulario e inserción de datos en la base de datos método 2 (ajax). break. apellido) values ('$documento'.$Datos) { switch($Opcion) { case "persona": $nombre= mysql_real_escape_string($Datos['nombre']). $this->realizarOperacion($consulta). $documento= mysql_real_escape_string($Datos['documento']). default: break. '$apellido')".function agregar($Opcion. $consulta = "INSERT INTO persona (documento. '$nombre'.php Formulario e inserción de datos en la base de datos método 2 (ajax).

ineficiente.tpl – C://wamp/www/trabajo/templates/agregarpersona.tpl <html> <title></title> <head> {literal} <script type="text/javascript" charset="utf-8" src="varios/funciones. 3) crear una o varias funciones javascript q nos permita recolectar en tiempo real la información que se lleno en el formulario anterior. porque este formulario NO nos enviara a otro sitio. 4) crear un archivo php que nos recoja la información que envio el javascrip anterior. todos unos archivos. 2) crear un controlador que nos permita mostrar el template anterior. este controlador a diferencia del de el tuorial pasado no tendrá post ni get ni la función agregar. Nuevamente primero organizaremos los pasos para luego empezar a codificar 1) crear un template un formulario donde podamos recoger la información. EMPECEMOS Codificación 1 Archivo: agregarpersona. la característica de este formulario es que no tendrá la parte del form. y luego se conecte a la base de datos para agregar los datos.js"></script> {/literal} </head> <body> <div id="mensajeoculto" style="display:none"> <table border="0" cellspacing="10"><tr><td> <b>Aviso</b><br /> . agregar o editar la información en “Tiempo Real” y mostrar los resultados en la misma página donde los estas agregando. 5) crear otra función javascript que recoja el resultado de ese archivo php y que muestre en la pagina actual el aviso de que se agrego correctamente la información. será nuevamente muy muy sencillo. entonces el ajax lo que te permite es SIN necesidad de volver a cargar toda una página.

como podemos ver las columnas donde agrego los input son de clase “informacion” (eso me lo invente yo) simplemente lo que hago es que esas columnas las voy a tratar de un modo especial. luego hay una división.this)">Agregar</button></td><td>&nbsp. luego creo una tabla de 4 filas por 2 columnas. ya que lo que diferencian esas columnas de las otras es que de ahí debo sacar la información que digita el usuario. esa división solo se mostrara cuando una persona sea agregada (ahí va un truco). Y por ultimo creo un botón que al darle clic ejecutara la función guardarregistro que leera los datos y realizara otros pasos que explicare en la codificación 3.js que es donde van a estar todas las funciones que me permiten trabajar con javascript.<div id="respuesta"></div> </td></tr></table> </div> <table border="0" cellspacing="10"> <tr><td><b>Documento:</b></td><td class="informacion"><input type="text" name="documento"></td></tr> <tr><td><b>Nombre:</b></td><td class="informacion"><input type="text" name="nombre"></td></tr> <tr><td><b>Apellido:</b></td><td class="informacion"><input type="text" name="apellido"></td></tr> <tr><td><button onclick="guardarregistro('persona'. como ven esa línea esta entre etiquetal {literal} {/literal} ya que smarty solo me permite usar scripts cuando uso estas etiquetas. Codificación 2 . es lo que muestra es: primero incluyo un archivo . de oculto.</ td></tr> </table> </body> </html> El código anterior.

php').php – C://wamp/www/trabajo/agregarpersona. //Muestra por pantalla todos los diferentes templates $smarty->display('agregarpersona. while (obj..js – C://wamp/www/trabajo/varios/funciones.Archivo: agregarpersona.obj) { var j=0.php <?php //cargamos las librerías de smarty require('include. ?> Es un simple controlador que muestra el archivo agregarpersona.tpl').js function guardarregistro(tipo. $call->display(). } } $call = new agregarpersona(). var resultados = new Array().tpl Codificación 3 y 5 (juntamos estas codificaciones ya que las funciones están juntas dentro del mismo archivo) Archivo: funciones. .tagName!='TABLE') obj = obj. class agregarpersona { public function display() { global $smarty.parentNode.

open("POST".var td = obj.setRequestHeader("Content-Type".php". ajax.send("documento="+re[0]+"&nombre="+re[1]+"&apellido="+re[2]+"&tipoform ato="+tipoformato). // una vez recogemos la respuesta.value. i++) { if(td[i]. } } .tipo). ajax.length. j=j+1.responseText. var len = td."application/x-www-form-urlencoded"). "ajax.onreadystatechange=function() { if (ajax.true).tipoformato) { ajax=objetoAjax().firstChild.split('[INTER]'). for (var i=0. } function procesarregistro(re. mostraraviso(data). if (tipoformato == 'persona') { ajax.readyState==1) {} if (ajax. actualizamos las columnas } } ajax. i<len.getElementsByTagName('TD'). } } procesarregistro(resultados.readyState==4) { data = ajax.className=='informacion') { resultados[j]=td[i].

divResultado.Funcion procesarregistro: crea un objeto tipo ajax (este objeto o función esta definido mas abajo y es una función general.XMLHTTP"). esta función envia la posición en la que estaba parado el botón.display=''.getElementById('mensajeoculto').send envia los datos en el orden en el cual fueron recolectados y por .function mostraraviso(data) { document. y una variable “tipo” que en el botón definimos como “persona”. } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.innerHTML = data[0]. Finalmente envia todos los resultados a la función procesarregistro. } . luego hace un for o un recorrido por todos los td.Funcion guardarregistro: cuando se da clic en el botón Agregar. se llama esta función. una ves encontrada esa primera tabla. } } if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp = new XMLHttpRequest().php luego el ajax. } function objetoAjax(){ var xmlhttp=false. dentro de ese recorrido analiza SI el td es de clase información (osea un input) entonces recoge la información que hay allí guardada y la asigna a un vector. busca todas las columnas o td dentro de esa tabla. } catch (E) { xmlhttp = false.style. try { xmlhttp = new ActiveXObject("Msxml2.getElementById('respuesta'). } return xmlhttp. apartir de esta posición busca la primer tabla (table) que contega esa posición.XMLHTTP"). . algo global que se ha definido para todos los ajax y no fue inventado por mi) este objeto ajax luego indica que va a enviar los datos pot POSt a un archivo ajax. divResultado = document.

$myGestorBD->agregar($Datos['tipoformato'].Funcion mostrar aviso: recolecta lo que envio el ajax.php es visto en codificación 4). $myGestorBD->cerrarConexion().php (que veremos en codificación 4) llama la función mostrar aviso.php y anteriormente habíamos definido en agregarpersona. echo "Informaci&oacute. class ajaxclas{ public function funciones($Datos) { $myGestorBD = new gestor().n agregada correctamente". } } .tpl una división “mensajeoculto” como oculta que nos e mostrara. Codificación 4 Archivo: ajax.php <?php include_once ("varios/gestor. y además en la división le asigna el mensaje que envio el ajax. $myGestorBD->conectar(). .php – C://wamp/www/trabajo/ajax.ultimo luego de que se ejecute lo que hay dentro de ajax.php (el ajax. en este caso mostraraviso activa esa división.php").$Datos).

y le dice que agregue una persona y le envia los datos. Lo raro de esta función es que hace un “echo” o impresión de datos. . ?> Es un archivo muy sencillo. llama a la función “funciones” y crea un objeto tipo gestor.php fue llamado por un objetoajax. $call->funciones($Datos). simplemente recoge por post los datos.$Datos = $_POST. y si saben de php un echo muestra datos por pantalla. allí mostrar aviso lo asignara al template y ahí si saldrá por pantalla. $call = new ajaxclas(). será devuelta y luego enviada a mostraraviso. En este caso ese mensaje de información agregada correctamente. pero en este caso como el ajax. el echo no se mostrara si no que será devuelto al objeto ajax que lo llamo.