En este screencast voy a mostraros un sencillo ejemplo de cómo utilizar jQuery para cargar contenido mediante ajax en CodeIgniter. El código está basado en el ejemplo del primer video “Introducción a CodeIgniter”, así que os recomiendo que le echéis un vistazo primero si no lo habéis hecho ya. Vamos a modificar ese código para que liste sólo los títulos de las entradas, y al hacer click en un título se cargue debajo el contenido de la entrada.
Este es el tercer videotutorial de la serie CodeIgniter, podéis encontrarlos todos en la página de screencasts, o suscribiros al podcast de iTunes.
Descargar ficheros con el código del ejemplo.
Ver screencast (duración: 11:21)
- Descargar videotutorial en alta calidad – MP4 (47 MB)
- Descargar videotutorial optimizado para iPod/iPhone – M4V (37 MB)
oh que bueno..
vamos a ver el tutorial
gracias master.
muy bueno el tutorial
sera que te podes hacer uno aplicando crud?
@mario Creo que con lo que explico en el primer tutorial y en el de formularios uno se puede montar un crud fácilmente, de todas formas si veo que hay demanda lo haré
Quizá haga un mini-video de cómo hacer CRUD usando scaffolding, que es una manera rápida y sencilla de hacerlo ya que viene dentro del sistema.
Que tal, disfrute mucho de tu primer screencast, y me dispongo a seguir ahora con este tercero, jeje sobretodo por que admito tener aun muchas dudas sobre como usar AJAX, un saludo y gracias por tus aportes.
Hola
encontre tu pagina mientras buscaba algo sobre codeigniter.
Tus videos son muy didacticos.
Me sumo al pedido de mas arriba haber si haces algo pequeñito aunque sea de CRUD con scaffolding.
@darlina Cuando tenga un rato libre veré que puedo hacer
CRUD con scaffolding es realmente fácil, en un video probablemente no me llevaría más de 3 minutos, así que es probable que simplemente ponga un post sin video, y más adelante haga un video cómo hacer CRUD apropiadamente (scaffolding es para usar en desarrollo, no en producción).
Buen tutorial si señor.
Yo lo que estoy intentando es cargar el contenido pero en vez de un anchor, debe ser un dropdown el cual tiene el id del articulo.
Usando la funcion .change(mifuncion()) si trabajo cada vez que cambia el mismo, pero aunque capturo la opcion seleccionada con $(‘option:selected’), no consigo hacer la carga, como que el problema es pasarle el parametro al metodo del codeigniter.
Tienes alguna idea? Gracias.
Me temo que con la explicación solo sin ver el código, no sé que problema puedes tener. Si acaso cuelga el código del js y el php en pastebin o algún sitio similar.
Muy bueno y bien claro los videos tutoriales..
Estaria muy bueno que continues con los videos tutoriales. Estaria una bueno con scaffolding y la utilizacion de helpers..
Tambien te recomiendo que pongas los videos tutoriales en este sitio http://www.illasaron.com/upload/ donde hay muchos tutoriales en castellano.
Tambien te pregunto si tenes experiencia en algunos de estos 2 framework http://www.kohanaphp.es y http://www.doophp.com Este ultimo lo estoy meditando de utilizar en un futuro proyecto web. Ya que es 100% PHP5, 100% UTF-8, ORM, MVC, y es uno de los mas rapido Framework para PHP 5 y permite utilizar la librerias de otro framework como Zend Framework, ademas de tener un Router de URL muy simple y claro, y la curva de aprendisaje parece ser muy simple, mas o = que CodeIgniter etc..
Vos que opinas.. de estas alternativas o si te contaron algo malo sobre esto framework..?
Saludos..
@Navegante Espero al menos hacer un video tutorial más sobre CodeIgniter, cuando tenga tiempo, y con él cerrar la serie (a menos que haya mucha demanda para más). Mi idea es seguir haciendo videotutoriales sobre otros temas (jQuery, otros frameworks php, html5/css3…).
Sobre los frameworks que me preguntas, oí hablar de doophp recientemente. Tiene muy buena pinta, sobre todo algunas cosas interesantes que trae de serie como soporte de ACL y REST, pero parece que aún es muy nuevo, acaba de salir, entonces habrá que darle tiempo a ver cómo evoluciona. La documentación podría estar mejor.
Sobre kohana, supongo que sabrás que es un fork de CodeIgniter hecho por la comunidad (CodeIgniter lo mantiene una empresa, al igual que doophp). Parece que ese fork se hizo porque no estaban de acuerdo con algunas decisiones que Ellislab tomaba sobre el framework (el soporte de PHP4 por ejemplo). La documentación tampoco es muy buena y no tiene demasiados usuarios comparado con su “padre”.
De momento me sigo quedando con CodeIgniter, y creo que lo seguiré haciendo por mucho tiempo, aunque como he dicho habrá que estar al tanto de cómo evoluciona doophp.
Puedes echarle un vistazo también a CakePHP, es algo más rígido que CI, pero se parece más al estilo de Rails.
Tutoriales de JQuery ya hay en castellano en este sitio tenes 21 videos bien esplicados por Jesus. Mira http://illasaron.com/upload/videos?ct=34
Y aca tenes la lista completa de todo lo que hay en castellano..
http://illasaron.com/upload
Esteria bueno Videos Tutoriales sobre el Zend Framework que no hay nada encastellano, y estaria bueno ya que podriamos decir es el oficial de PHP y mas futuro va tener apesar que es mas complicado y mas lento..
Aca podes encontrar esta pagina solo con videos tutoriales de Zend Framework, pero estan en ingles http://www.zendcasts.com/
Una pregunta tú pagina esta realizada con CodeIgniter..?
Saludos
@Navegante Zend es el framework oficial a nivel corporativo, pero no me convence su forma de trabajar. Las empresas pequeñas y start-ups suelen optar por frameworks MVC más ligeros.
Sobre los tutoriales, yo suelo verlos todos en inglés, pero soy consciente que mucha gente hispana no tiene nivel suficiente para entenderlos, por eso intento aportar algo a la comunidad haciendo estos videos en castellano.
Mi web está con WordPress. Consideré hacerla con CodeIgniter, pero visto que WordPress es el estándar para los blogs decidí darle una oportunidad y diseñarme una plantilla a medida.
Hola David yo de nuevo; te quería hacer una pregunta ya que vos tenes experiencia en algunos trabajos con framework como CodeIgniter en producción.
Quiero saber si el hacer un debug sobre un framework da mucho problema ya que antes de llegar a tu codigo da muchas vueltas por otras partes del framework.. Que es lo que recomendas..? Con que IDE hace el debug vos..? Zend o NetBeans o cual otra utilizas..? y en si todo este trabajo se ve más engorroso o es = que cuando uno hace un sitio sin framework..?
Saludos
@Navegante El debug lo hago bastante manual, no utilizo ningún entorno, programo con el TextMate de mac (el que ves en los videos), y hago el debug simplemente a base de imprimir variables, usar el profiler de CodeIgniter, o volcar datos a la consola del Firebug mediante javascript. El tema de si el framework da muchas vueltas, con frameworks sencillos como CodeIgniter no suele ser problemático (si usas hooks tienes que tener cuidado). Desarrollando módulos con Drupal sí he tenido muchos problemas, ya que es un framework-CMS, tienes muchos módulos y no sabes en qué momento está haciendo cada cosa. Pero como te digo, con frameworks sencillos es como si programaras en PHP simplemente.
Te felicito David. La verdad es que mejor explicado no se puede. He visitado muchos sitios para introducirme en el Jquery + Codeigniter y tu tutorial, el mejor sin duda.GRACIAS.
Tengo una duda, he creado lo siguiente:
$(function(){
$(‘ul a’).click(function(event){
event.preventDefault();
//$(‘#page’).remove();
$(this).parent().after(”);
$(‘#page’).html(‘<img src="images/spinner.gif” />’).load($(this).attr(‘href’));
})
})
$(function(){
$(‘#page a’).click(function(event){
window.alert(“hola”);
event.preventDefault();
//$(‘#page’).remove();
$(this).parent().after(”);
$(‘#page’).html(‘<img src="images/spinner.gif” />’).load($(this).attr(‘href’));
})
})
Pues bien, el menú funciona correctamente, cuando se pulsa un ul , el conteido se carga en el div “page”, pero si pulso un enlace dentro de page, no se carga dentro de este. ¿Sabes que hago mal? Porque no le veo nada raro a la segunda función.
¿Cómo se puede especificar los enlaces que estén dentro de un div cuyo id es “page”?
He probado con $(#page a) pero no se invoca.
Gracias!
@Browser El problema creo que lo tienes porque estas adjuntando eventos click a los enlaces dentro de #page, y después cargas contenido en #page eliminando el contenido que había, incluido esos enlaces y por lo tanto sus eventos adjuntos. La solución pasa por usar la función live para adjuntar estos eventos click, de manera que así adjuntas los eventos tanto para los elementos existentes como para los futuros (es decir, funcionará con los enlaces que haya en el nuevo contenido que se cargue en #page). Échale un vistazo a la documentación.
Hola David, siempre de ayudas tus videoturiales.
Oye como podria utilizar este ajax con jquery y el menu acordeon que realizastes? que me muestre la información que carga en otro lado de la pantalla (una variable $contenido)!.
Saludos, gracias
@Alfred No tiene mucha complicación, solo haz que los links del menú apunten mediante jquery a la carga de las páginas que quieras. Si has entendido los dos tutoriales, es muy sencillo, échale un vistazo a la ayuda de la función load de jquery: http://api.jquery.com/load/
Chaval eres la pera. Solo como comentario pararte un seg mas en el tema de js para los que no sabemos jquery. Muy bueno
un saludo
Gustavo
buenas tardes me gustaria saber si tienes algun ejemplo en codeigniter de seleccion dependiente con base de datos por ejemplo tablas pais estados me gustaria saber si me puedes ayudar con eso.
@francisco No entiendo qué preguntas exactamente. Lo mejor es que intentes hacerlo tú mismo y expongas aquí los problemas que tengas, y ya te echamos una mano.