Tutoriales y foros de diseño web

Introducción al framework CodeIgniter

Mis estimados amigos, bienvenidos a esta primera parte de como usar el framework para PHP: CodeIgniter. En esta primera parte
veremos cómo configurar CI y cómo usar su sistema de views, ademas de intentar conseguir una novia para Pley();.

CI es un framework orientado a objetos, aplicando el patrón de diseño Modelo Vista Controlador. Voy a dar como supuesto que todos
manejan medianamente bien php y que, al igual que yo, jamas en su vida habían usado un framework. Empecemos descargando
codeignaiter. Descomprimanlo y subanlo a su hosting favorito (localhost). Renombren la carpeta con el nombre del proyecto que en
este caso y en honor a "Pley();" se llamara "quiero-novia" el cual sera un catalogo para una florería.

Tenemos la carpeta user_guide, system e index.php. La guía es la misma que se encuentra en su sitio oficial. El index es el mismo
que se usara en este proyecto y en system está todo lo que hará funcionar el sistema, por tanto solo nos interesan los 2 últimos.

Por ultimo, creen una base de datos para el proyecto en MySQL llamada "garageflash".

Ya todo esto listo, ¡manos a la obra! la carpeta en la cual programaremos nuestra aplicación es justamente application, alojada en la
carpeta system.

Empezaremos editando los archivos de configuración que necesitaremos para empezar a programar
database.php
Editaremos los datos para la conexión a nuestra DB favorita: garageflash en MySQL.
Código :
$db['default']['hostname'] = "localhost";
$db['default']['username'] = "garageflash";
$db['default']['password'] = "clab";
$db['default']['database'] = "garageflash";
$db['default']['dbdriver'] = "mysql";
$db['default']['dbprefix'] = "";
$db['default']['pconnect'] = TRUE;
$db['default']['db_debug'] = TRUE;
$db['default']['cache_on'] = FALSE;
$db['default']['cachedir'] = "";
$db['default']['char_set'] = "utf8";
$db['default']['dbcollat'] = "utf8_general_ci";

No me detendré a explicar que significa cada variable, por que el nombre de cada una de ellas es muy descriptivo.
config.php
Designa la ruta en la que se encuentra alojada nuestra web entre otros datos
Código :
$config['base_url'] = 'http://127.0.0.1/quiero-novia';

$config['index_page'] = 'index.php';

$config['uri_protocol'] = 'AUTO';

$config['url_suffix'] = '';

$config['language'] = 'spanish';

$config['charset'] = 'UTF-8';

Cuidado con la ruta que vayan a poner en $config['base_url'], si quieres salir a internet debiese ser tu IP publica o DNS.
routes.php
Código :
$route['default_controller'] = 'floreria';
$route['scaffolding_trigger'] = "";

Acá nos detendremos en 2 detalles importantes

El 'default_controller' se refiere a el controlador o pagina principal **cof cof clase cof cof ** en la cual programaremos nuestra
aplicación, mas adelante ahondaremos en esto.
'scafolding_trigger' sirve para usar los mentados scafolding (administración pre-fabricada), pero como no me gusta usarlos por
fundadas razones dejaremos esta opción en blanco ¿razones?:

No se me da la gana.
Son muy estáticas, difíciles de adaptar.
Inseguras, dentro de el apartado adaptar me referías integrarlas a un sistema de usuarios.
En el video tutorial (en ingles) muestran como usarlas, pero como a mi no me gustan.

Empezando a programar el proyecto

Recordarás que a 'default_controller' le asignamos 'floreria'. Así se llamara nuestra clase. Creamos el archivo 'floreria.php' en la
carpeta
system/aplication/controllers, en el cual crearemos nuestra clase que obviamente heredara de la clase controladores.
Código :
class Floreria extends Controller {

function Floreria ()
{
parent::Controller();
}
function index()
{
$this->load->view('floreria');
}
}

Dentro de esta clase está la función que siempre se llamara index. En esta clase pondremos todo lo que queremos que se muestre en
la primera pantalla de nuestra clase. Si eres buen observador te darás cuenta que se esta llamando a la clase view, que es la que
usaremos para manejar nuestros templates. Como primer paso, escribiremos el titulo y encabezado en nuestro template. Este código
debe ir en un archivo nuevo en: system/aplication/views/floreria.php. Ese será nuestro template:
Código :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm
l1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<title>Quiero Novia</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<h1>Flores Para Conseguir Novia</h1>
</body>
</html>

Grabamos y vemos el resultado en nuestro navegador.

Ahora nos toca enviar variables a nuestro template, para esto modificaremos nuestro template del siguiente modo:
Código :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm
l1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<title><?php echo $titulo ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<h1><?php echo $encabezado ?></h1>
</body>
</html>

Y luego modificaremos nuestra función index() del siguiente modo para poder enviarle las variables requeridas:
Código :
class Floreria extends Controller {

function Floreria ()
{
parent::Controller();
}
function index()
{
$datos['titulo']='Quiero Novia';
$datos['encabezado']='Una Novia para Pley';
$this->load->view('floreria',$datos);
}
}

A la función view, además del nombre del template, le entregamos un array donde sus vectores serán las variables que se usaran en
dicho template. Mira el resultado en el navegador.

Para en un futuro aplicarle formato a esta cosa y mantener la misma estructura en todo el sitio, separaremos el template en 3 partes:
header
Código :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm
l1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<title><?php echo $titulo ?></title>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>

contenido (en este caso floreria)

Código :
<h1>
<?php echo $encabezado ?>
</h1>

foot
Código :
</body>
</html>

Ahora nuestra función index() de la clase florería quedaría así:

Código :
function index()
{
$datos['titulo']='Quiero Novia';
$datos['encabezado']='Una Novia para Pley';
$this->load->view('header',$datos);
$this->load->view('floreria',$datos);
$this->load->view('foot);
}

Ahora subiremos datos a nuestro sistema, para lo cual crearemos una segunda clase llamada 'admin' en la cual administraremos el
sistema. En este paso voy a obviar el infaltable sistema de usuarios, para el cual pueden seguir esta serie de tutoriales que trata a
profundidad el tema.

Continuará.

Pagina oficial del proyecto

Interesante blog con muchos tips útiles

También te interesa
HMVC: Extensión para crear módulos o plugins en Codeigniter
Crear una clase para conectar a la base de datos (IV)
Crear una clase para conectar a base de datos con PHP (II)

Final del formulario

Consultas MySQL en CodeIgniter
Aunque pueda parecer difícil, hacer consultas en MySQL en CodeIgniter es la cosa más fácil
del mundo. Y no solo con MySQL sino con todos los protocolos soportados por el framework. Es
importante, sobretodo, que tengamos nuestro CodeIgniter correctamente configurado. Podéis
echarle una ojeada al artículo de configuración y iniciación para ver como configuramos
los datos de MySQL.
CodeIgniter, a parte, nos da la posibilidad de trabajar con más de una base de datos a la vez,
configurando y conectando específicamente a una u otra dependiendo de las necesidades. Sin
embargo, no es el objeto de esta explicación.
Supongamos que queremos hacer una consulta parecida a la siguiente:
SELECT * FROM entradas
Lo normal en PHP sería usar un mysql_query(“SELECT * FROM entradas”);, sin embargo
en CodeIgniter (y usando librería específica) lo usaríamos de la siguiente forma:
[code lang="php"]
$this->db->query("SELECT * FROM entradas");
[/code]

GET
Conclusión, podemos usarlo de la misma manera. Luego si quisiéramos estructurar los resultados
podríamos usar la función foreach de PHP. Sin embargo, hay una manera mucho más fácil
enCodeIgniter de tratar las consultas. Ellos lo llaman el Active Record Class y se emplearía,
para el ejemplo de antes, así:
[code lang="php"]
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas;
[/code]
También en $this->db->get(); es posible usar un segundo parámetro para especificar un LIMIT:
[code lang="php"]
$query = $this->db->get("entradas", 10, 20);
// Genera: SELECT * FROM entradas LIMIT 20,10
[/code]

SELECT
También podemos especificar el SELECT con $this->db->select(); tipo:
[code lang="php"]
$query = $this->db->select("id,title,body");
$query = $this->db->get("entradas");
// Genera: SELECT id,title,body FROM entradas
[/code]
Existen algunas funciones de MySQL que tienen una propiedad de SELECT específica
en CodeIgniter, sin embargo, solo los listaré ya que no los usaremos en aplicaciones básicas:
$this->db->select_max();
$this->db->select_min();
$this->db->select_avg();
$this->db->select_sum();

JOIN
Esto nos permite unir dos tablas tal que así:
[code lang="php"]
$query = $this->db->join("comentarios", "comentarios.id = entradas.id");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas JOIN comentarios ON comentarios.id = entradas.id
[/code]

WHERE
[code lang="php"]
$query = $this->db->where("id","38");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas WHERE id = '38'
[/code]
Si quisiéramos podríamos unir varios WHERE, simplemente añadiendo otras condiciones:
[code lang="php"]
$query = $this->db->where("id","38");
$query = $this->db->where("name","Isern");
$query = $this->db->where("surname","Palaus");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas WHERE id = '38' AND name = 'Isern' AND surname = 'Palaus'
[/code]
Pero claro, no todo son igualdades. Quizás queremos buscar una cosa que sea más pequeña que, o
diferente, o mayor, etcétera. La forma es especificar en el primer campo, si no hay nada se
tomará =por defecto:
[code lang="php"]
$query = $this->db->where("id >","38");
$query = $this->db->where("name !=","Isern");
$query = $this->db->where("surname","Palaus");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas WHERE id > '38' AND name != 'Isern' AND surname = 'Palaus'
[/code]
Al igual que SELECT, hay muchas más propiedades:
$this->db->or_where();
$this->db->where_in();
$this->db->or_where_in();
$this->db->where_not_in();
$this->db->or_where_not_in();

LIKE
[code lang="php"]
$query = $this->db->like("body","sentencia");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entras LIKE body = '%sentencia%'
[/code]
Sin embargo, podría ser que no quisiéramos que las dos partes fueran aleatorias… De modo que
podemos especificar en un tercer campo el % donde debe estar. Puede ser: before, both y after.
[code lang="php"]
$query = $this->db->like("body","sentencia1","before");
$query = $this->db->like("title","sentencia2","both");
$query = $this->db->like("slug","sentencia3","after");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas LIKE body = '%sentencia1' AND title = '%sentencia2%' AND slug
= 'sentencia3%'
[/code]
Otros tipos de LIKE que podemos usar son:
$this->db->not_like();
$this->db->or_not_like();
$this->db->group_by();

GROUP BY
En otras versiones se conocia como $this->db->groupby(); pero ha sido eliminado.
[code lang="php"]
$query = $this->db->group_by("title");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas GROUP BY title
[/code]

DISTINCT
Para añadir DISTINCT a la consulta:
[code lang="php"]
$query = $this->db->distinct();
$query = $this->db->get("entradas");
// Genera: SELECT DISTINCT * FROM entradas
[/code]

HAVING
[code lang="php"]
$query = $this->db->having("uid = 32");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas HAVING uid = 32
[/code]
También es posible usar $this->db->or_having();

ORDER BY
$this->db->order_by(); permite ordenar un resultado en una dirección especifica. En el primer
parámetro especificamos el nombre de la columna y en el segundo la dirección. Las posibilidades
del segundo parámetro son: ASC, DESC y RANDOM.
[code lang="php"]
$query = $this->db->order_by("id","DESC");
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas ORDER BYid DESC
[/code]

LIMIT
Permite especificar el limite de resultados que quieres que devuelva:
[code lang="php"]
$query = $this->db->limit(30);
$query = $this->db->get("entradas");
// Genera: SELECT * FROM entradas LIMIT 10
[/code]

COUNT ALL
Permite contar el numero de entradas que hay en una tabla:
[code lang="php"]
$num = $this->db->count_all("entradas");
// Genera: un numero que lo podemos tratar como una variable o escribirlo
[/code]

COUNT ALL RESULTS

A diferencia de COUNT ALL, nos permite contar el numero de resultados en la actual consulta:
[code lang="php"]
$query = $this->db->where("name","Isern");
$query = $this->db->get("entradas");
$num = $this->db->count_all_results();
// Genera: un numero
[/code]

INSERT
Para insertar datos usando el Active Record de CodeIgniter debemos usar un array luego
insertar:
[code lang="php"]
$insert = array("title" => "Test",
"body" => "Test",
"name" => "Isern",
"surname" => "Palaus");
$this->db->insert("entradas",$insert);
// Genera: INSERT INTO entradas (title, body, name, surname) VALUES ('Test', 'Test', 'Isern',
'Palaus')
[/code]

UPDATE
Al igual que INSERT usaremos un array para insertar, sin embargo si queremos actualizar, por
ejemplo, una entrada deberemos especificar un where:
[code lang="php"]
$update = array("title" => "Test",
"body" => "Test",
"name" => "Isern",
"surname" => "Palaus");
$this->db->where("id","3");
$this->db->update("entradas",$update);
// Genera: UPDATE entradas SET title = 'Test', body = 'Test', name = 'Isern', surname = 'Palaus'
WHERE id = 3
[/code]

DELETE
Al igual que UPDATE usaremos un ID para especificar cual es la que queremos borrar:
[code lang="php"]
$this->db->where("id","3");
$this->db->delete("entradas");
// Genera: DELETE FROM entradas WHERE id = 3
[/code]
Y esto es más o menos todo lo que nos ofrece CodeIgniter para tratar nuestras bases de datos.
Espero que haya servido de ayuda a más de uno ya que muchas visitas recibidas buscaban como
usar MySQL en CodeIgniter.

CodeIgniter: Paginar resultados

CodeIgniter, como buen framework que es, tiene una librería para poder paginar nuestros
resultados. En cuanto a paginar me refiero a tener la posibilidad de crear paginas entre resultados,
por ejemplo, cada 10 resultados 1 pagina. Nosotros vamos a usar el código del blog que creamos en
el artículoCodeIgniter: Aplicación Básica (I), Creación de un Blog.
Para empezar vamos a recuperar el código que nos muestra las entradas del blog:
Archivo: /application/controllers/blog.php
[code lang="php"]
function index()
{
$query = $this->db->orderby("id","desc");
$query = $this->db->;get("posts");
$this->load->helper("date");
$datestring = "%d-%m-%Y";
foreach ($query->result() as $row) {
$data["posts"][$row->id]["title"] = $row->title;
$data["posts"][$row->id]["url"] = $row->url_title;
$data["posts"][$row->id]["body"] = $row->body;
$data["posts"][$row->id]["date"] = mdate($datestring,$row->created_on);
}
$this->load->view("blog_front",$data);
}
[/code]
Para no complicar mucho la cosa con rutas y .htaccess vamos a cambiar los enlaces permanentes a
nuestras entradas a localhost/blog/goto/enlace-permamente. Lo primero que tenemos que hacer en
nuestro controlador es cargar la librería de pagination:
Archivo: /application/controllers/blog.php, Línea: 15
[code lang="php"]
$this->load->library("pagination");
[/code]
Justo antes de $this->load->helper(“date”);. Para usar esta librería tenemos que configurar varias
cosas como: la URL base, el total de entradas que tenemos en la base de datos y el total por
entrada. Una vez configurado, lo cargamos:
Archivo: /application/controllers/blog.php
[code lang="php"]
$this->load->library("pagination");
$config["base_url"] = base_url().index_page();
$config["total_rows"] = $this->db->count_all("posts");
$config["per_page"] = "4";
$this->pagination->initialize($config);
[/code]
También tenemos que especificar en que posición en la URL se va a especificar la pagina. Esto lo
haremos con $this->uri->segment(); como usamos en el artículo anterior.
[code lang="php"]
$num = $this->uri->segment(1);
[/code]
Y lo más importante: como hacer las consultas a la base de datos. Para hacerlo mucho más fácil,
vamos a usar un modelo. Es decir, en el controlador solo gestionaremos los datos y mandaremos al
modelo hacer las consultas. Sin embargo vamos a usar un pequeño truco para pasar esta la
información:
[code lang="php"]
if($num === "all"){
$data["posts"] = $this->blog_model->getPaginated("posts",$config["per_page"]);
} else {
if(!isset($num) OR !is_numeric($num)) $num = 0;
$data["posts"] = $this->blog_model->getPaginated("posts",$config["per_page"],$num);
}
[/code]
Primero comprobamos si $num es igual a all, si es así, mostramos las primeras entradas (las más
recientes) limitando al numero que hemos configurado por pagina. Si esto no se cumple
comprobamos si $num esta especificado (recordar que lo recupera de la URI) o si es realmente un
número, sino atribuye el valor de la variable a 0. A partir de aquí, busca también a partir
de $numvalores los siguientes siendo estos especificados por pagina. Si veis como es el modelo lo
veréis más claro:
Archivo: /application/models/blog_model.php
[code lang="php"]
class Blog_model extends Model
{
function __construct ()
{
parent::__construct();
}
function getPaginated($table,$num=-1,$offset=-1)
{
$sql = "SELECT * from ".$table." order by id desc";
if($num != -1)
$sql .= " limit ";
if($num != -1 AND $offset != -1)
$sql .= "$offset,";
if($num != -1)
$sql .= "$num";
$query = $this->db->query($sql);
$this->load->helper("date");
$datestring = "%d-%m-%Y";
foreach ($query->result() as $row) {
$data["posts"][$row->id]["title"] = $row->title;
$data["posts"][$row->id]["url"] = $row->url_title;
$data["posts"][$row->id]["body"] = $row->body;
$data["posts"][$row->id]["date"] = mdate($datestring,$row->created_on);
}
return $data["posts"];
}
}
?>
[/code]
Como podéis comprobar gran parte del código es el que ya usábamos en el controlador. Es
importante que se guarde este fichero con el nombre de blog_model.php y lo carguemos luego en
el controlador con $this->load->model(“blog_model”);.
Bien, nuestro controlador blog.php debería ser algo así:
Archivo: /application/controllers/blog.php
[code lang="php"]
function show()
{
$url_title = $this->uri->segment(2, 0);
if($url_title) {
$this->load->helper("date");
$datestring = "%d-%m-%Y";
$query = $this->db->where("url_title",$url_title);
$query = $this->db->get("posts");
foreach ($query->result() as $row) {
$data["post"]["id"] = $row->id;
$data["post"]["title"] = $row->title;
$data["post"]["url"] = $row->url_title;
$data["post"]["body"] = $row->body;
$data["post"]["date"] = mdate($datestring,$row->created_on);
}
$this->load->view("blog_single",$data);
} else {
redirect();
}
}
[/code]
Y también tenemos que editar el routes.php:
[code lang="php"]
$route['default_controller'] = "blog";
$route['scaffolding_trigger'] = "";
$route["blog"] = "blog";
$route["add"] = "blog/add";
$route["goto/:any"] = "blog/show";
$route[":any"] = "blog";
[/code]
Esto implica cambiar en blog_front.php y blog_single.php los enlaces permanentes por:
/goto/enlace-permanente.
[code lang="php"]
anchor("goto/".$post["url"],"Enlace Permanente").
[/code]
Y para finalizar solo nos queda añadir los enlaces para crear las paginas. Esto lo hacemos con una
función de la librería de pagination $this->pagination->create_links();, yo lo he añadido tal que así:
Archivo: /application/views/blog_front.php
[code lang="php"]
pagination->create_links();?>
foreach ($posts as $id => $post) {
echo "

".anchor("goto/".$post["url"],"#".$id)." ".
$post["title"]."
";
echo "
".$post["body"]."
";
echo "".anchor("goto/".$post["url"],"Enlace Permanente")." - ".$post["date"]."";
}
?>
pagination->create_links();?>
Page rendered in {elapsed_time} seconds
[/code]

CodeIgniter: Aplicación Básica (I),

Creación de un Blog
Después de la introducción decomo configurar CodeIgniter, lo mejor sería empezar con
un ejemplo básico de como usar CodeIgniter. Lo más común son los sistemas de noticias o un
weblog, que funcionarían igual (añadir a una base de datos, listar juntos, listar individuales), así
que vamos a crear uno.
Lo primero que vamos a necesitar es CodeIgniter, podéis recurrir a la web oficial para
descargarlo o usar la pre-configuración del artículo CodeIgniter: Iniciación y
Configuración (concretamente este). Una vez descomprimido vamos a renombrar algunos
ficheros y configurar algunos.
Accedemos a /application/controllers/ y cambiamos el nombre
de welcome.php a blog.php.Blog.php será la base de nuestra aplicación, el controlador principal. Lo
abrimos y veremos como es, por defecto, un controlador de CodeIgniter. En este primer ejemplo no
vamos a usar modelos para no complicar las cosas, en un futuro, lo haremos. Editamos nuestro
archivo blog.php para que quede tal que así:
Archivo: /application/controllers/blog.php
[code lang="php"]
class Blog extends Controller {
function Blog()
{
parent::Controller();
}
function index()
{
}
}
?>
[/code]
Es sumamente importante que sea class Blog y no class blog, al igual que function Blog() y
no function blog().
Ahora vamos a configurar CodeIgniter para que su controlador principal sea blog.php de modo que
cuando accedamos a la pagina web sin establecer controlador alguno, sea blog.php el controlador
por defecto. Para hacer esto necesitamos configurar el archivo routes.php y podemos encontrarlo
en/application/config. Routes.php se ocupa de las rutas de nuestra URI, se usa habitualmente para
redirigir cosas a los controladores. Si por ejemplo queremos que una dirección tipo
/producto/id/123 vaya a productos.php y /producto/nombre/abc también vaya a productos.php
podríamos usar algo similar a esto:
[code lang="php"]
$route['/producto/id/:num'] = "productos/productById";
$route['/producto/name/:any'] = "productos/productByName";
[/code]
Siendo productById y productByName dos funciones dentro del controlador productos.php. Bien,
pero eso no es lo que necesitamos nosotros ahora mismo. El archivo routes.php también se usa
para establecer el controlador por defecto y por defecto hay el welcome, nosotros lo cambiaremos
porblog:
Archivo: /application/config/routes.php, Línea: 43
[code lang="php"]
$route['default_controller'] = "blog";
[/code]
También será necesario usar autoload.php, también en /application/config/ para cargar
automáticamente una librería (database) y un helper (url):
Archivo: /application/config/autoload.php, Línea: 42
[code lang="php"]
$autoload['libraries'] = array("database");
[/code]
Archivo: /application/config/autoload.php, Línea: 54
[code lang="php"]
$autoload['helper'] = array("url");
[/code]
Al añadir database al array de librerías, se cargar cada vez que accedamos a cualquier controlador.
Como nuestra aplicación estará basada en la base de datos, y la usaremos todo el rato, ya nos va
bien cargarla al principio. El helper url lo vamos a usar para

Base de Datos
Ahora realmente empezamos a trabajar con la aplicación, lo primero que necesitaremos será una
base de datos MySQL. Para configurar los datos de la base de datos deberemos acceder
a/application/config/database.php como ya expliqué en el artículo CodeIgniter: Iniciación y
Configuración. Una vez configurado, crearemos nuestra tabla. El esquema sería el siguiente:
[code]
CREATE TABLE `posts` (
`id` int(5) NOT NULL auto_increment,
`title` varchar(64) NOT NULL,
`url_title` varchar(64) NOT NULL,
`body` text NOT NULL,
`created_on` varchar(10) default NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
[/code]
El único campo que puede confundir un poco es el campo url_title, este campo lo usaremos para
crear URI tipo: blog.iplauas.es/este-seria-el-url-title.

Controlador y vistas
Vamos a crear nuestro controlador. Los controladores los podemos dividir mediante funciones,
nosotros vamos a usar la función index() para mostrar las entradas, show() para ver una entrada en
particular (enlace permanente) y add() para añadirlas.
Lo primero que haremos en nuestra función index() va a ser la consulta a MySQL. En esta consulta,
pondremos en un array() todas las entradas que tengamos en nuestra tabla MySQL. Debería ser
algo así:
Archivo: /application/controllers/blog.php
[code lang="php"]
function index()
{
$query = $this->db->orderby("id","desc");
$query = $this->db->get("posts");
foreach ($query->result() as $row) {
$data["posts"][$row->id]["title"] = $row->title;
$data["posts"][$row->id]["url"] = $row->url_title;
$data["posts"][$row->id]["body"] = $row->body;
$data["posts"][$row->id]["date"] = $row->created_on
}
}
[/code]
Como podéis comprobar, lo primero que hacemos es ordenarlos por ID y luego almacenamos en el
array $data["posts"] el contenido de las entradas. Sin embargo, tengo planteado guardar la fecha
en timestamp de modo que necesitaremos convertirla a una fecha humana. Para esto usaremos
el helperdate de CodeIgniter. Para cargar un helper debemos usar la expresión: $this->load-
>helper();. En nuestro caso, crearemos un patrón para las fechas que lo almacenaremos en una
variable:
Archivo: /application/controllers/blog.php
[code lang="php"]
function index()
{
$query = $this->db->orderby("id","desc");
$query = $this->db->get("posts");
foreach ($query->result() as $row) {
$data["posts"][$row->id]["title"] = $row->title;
$data["posts"][$row->id]["url"] = $row->url_title;
$data["posts"][$row->id]["body"] = $row->body;
$data["posts"][$row->id]["date"] = $row->created_on
}
}
[/code]
De este modo la fecha se mostrará DD-MM-AAAA. Con esto tenemos nuestro
controlador index()listo. Solo nos falta añadir la salida, lo que llamaremos view y podemos
encontrar en/application/views/. Si accedemos al directorio veremos el
archivo welcome_message.php, le cambiaremos el nombre a blog_front.php. Lo abrimos con
nuestro editor de textos y veremos que hay establecidos unos estilos (CSS), vamos a usar los
mismos.
Lo primero que necesitamos saber es como cargar la vista desde nuestro controlador, para cargar
la vista lo haremos con $this->load->view();. Otro tema de las vistas es añadirle nuestro
contenido dinámico, para pasar el contenido tendremos que añadir una variable. Veamos como lo
haríamos en nuestro ejemplo, siendo nuestro contenido el array $data.
Archivo: /application/controllers/blog.php
[code lang="php"]
function index()
{
$query = $this->db->orderby("id","desc");
$query = $this->db->get("posts");
$this->load->helper('date');
$datestring = "%d-%m-%Y";
foreach ($query->result() as $row) {
$data["posts"][$row->id]["title"] = $row->title;
$data["posts"][$row->id]["url"] = $row->url_title;
$data["posts"][$row->id]["body"] = $row->body;
$data["posts"][$row->id]["date"] = date($datestring,$row->created_on);
}
$this->load->view("blog_front",$data);
}
[/code]
Si ejecutáis este código, funcionará al 100%. Sin embargo, en nuestra vista, no vamos a ver más
que el mensaje estático del welcome_message.php que hemos renombrado. Ahora es el momento
de empezar a crear como se verá. Vamos a hacerlo muy sencillo para que veáis como trabajar con
las variables que hemos pasado. Entre las dos etiquetas body del archivo blog_front.php, vamos a
poner este código:
[code lang="php"]
foreach ($posts as $id => $post) {
echo "

".anchor($post["url"],"#".$id)." ".
$post["title"]."
";
echo "
".$post["body"]."
";
echo "".anchor($post["url"],"Enlace Permanente")." - ".$post["date"]."";
}
?>
Pagina generada en {elapsed_time} segundos
[/code]
Como podéis recordar, nosotros teníamos una variable $data["posts"], que realmente es un
array$posts dentro del array $data. Dentro del array $posts tenemos un array para cada ID de
entrada. Para eso usamos la función foreach, para “dividir” estos arrays y generar el contenido
para cada ID. En cuanto al contenido dentro del ID podéis fijaros en la siguiente expresión:
[code lang="php"]
anchor($post["url"],"#".$id)
[/code]
anchor() es una función que forma parte del helper url que hemos usado en autoload.php. En el
primer termino de la función especificamos la dirección a donde debe apuntar el enlace y, en la
segunda, el texto a mostrar.
Con esto que tenemos ya podemos mostrar las entradas correctamente, ahora vamos a crear la
función show() en blog.php para ver una específica. Para empezar, clonaremos el blog_front.php y
lo nombraremos blog_single.php. De momento lo dejaremos así. Volveremos al
controlador blog.php y añadiremos el siguiente código:
[code lang="php"]
function show()
{
$url_title = $this->uri->segment(1, 0);
if($url_title) {
$this->load->helper('date');
$datestring = "%d-%m-%Y";
$query = $this->db->where("url_title",$url_title);
$query = $this->db->get('posts');
foreach ($query->result() as $row) {
$data["post"]["id"] = $row->id;
$data["post"]["title"] = $row->title;
$data["post"]["url"] = $row->url_title;
$data["post"]["body"] = $row->body;
$data["post"]["date"] = mdate($datestring,$row->created_on);
}
$this->load->view('blog_single',$data);
} else {
redirect();
}
}
[/code]
Podemos ver que el código es prácticamente igual al de la función index(), pero este tiene una
particularidad: muestra solo una entrada. Como podéis ver, al principio del código establecemos
el$url_title con $this->uri->segment(1, 0);. Esto nos permite recibir un segmento
determinado de la URI, en nuestro caso, el primero. Acto seguido comprobamos si existe algo
establecido y si existe empezamos a montar la estructura. Hemos añadido una cosa en la
sentencia $query, hemos usado$this->db->where(“url_title”,$url_title); para
establecer que el campo url_title de la base de datos sea igual al $url_title.
Si todo esto no se cumpliera, hay un redirect() que los envía al principio de la aplicación.
También tenemos que cambiar el código de nuestra vista, ya que solo hemos duplicado el archivo.
Entre las etiquetas y debería haber algo así:
Archivo: /application/views/blog_single.php
[code lang="php"]
-
Page rendered in {elapsed_time} seconds
[/code]
Solo nos falta un truco que hemos usado en archivo routes.php que hemos hablado antes:
Archivo: /application/config/routes.php, Línea: 46-49
[code lang="php"]
$route["blog"] = "blog";
$route["add"] = "blog/add";
$route[":any"] = "blog/show";
[/code]

AJAX Login con jQuery y Code Igniter

(PHP)
Nueva versión del tutorial: AJAX Login con jQuery y CodeIgniter – v2 + archivos
Uno de los principales problemas a la hora de empezar a programar es que muchos usuarios
necesitamos donde mirar por tal de tener una base para empezar nuestro programa. No es lo mejor
a la larga porque siempre terminamos basando nuestro trabajo en otros proyectos, pero es una
buena forma de empezar a programar. En este caso explicaré como hacer un sistema que valide a
lo usuarios mediante un formulario AJAX y el framework PHP Code Igniter.
Lo primero que necesitamos en este caso es jQuery que podemos descargarlo desde la web oficial.
jQuery es una librería de JavaScript que nos facilita muchísimo las cosas a la hora de programar.
Obviamente también necesitaremos Code Igniter y me reservo el derecho en publicar una entrada
futura sobre el mismo.
Para empezar lo haremos con una cosa sencilla, la base de datos que vamos a usar. Es bien simple:
id, usuario, contraseña, correo y hora de “registro”.
[code lang="mysql"]
CREATE TABLE `users` (
`uid` int(10) NOT NULL auto_increment,
`username` varchar(16) NOT NULL,
`password` varchar(32) NOT NULL,
`email` varchar(128) NOT NULL,
`time` int(10) NOT NULL,
PRIMARY KEY (`uid`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
[/code]
Ahora es hora del controlador que llamaré user.php, este user.php se ocupará de las funciones
básicas como son: comprobar el usuario y la desconexión del mismo.
[code lang="php"]
load->model("user_model");
$this->load->model("dalia_model");
$this->load->helper("security");
$this->load->helper("form");
}
/* Checks if the password that the user gives is equal at the DB ones */
function _check_login($username) {
$password = md5($this->validation->password);
if(!$this->user_model->checkUserLogin($username,$password,"users"))
return FALSE;
return TRUE;
}
function index() {
$this->load->view("userLogin");
}
function checkLogin()
{
$this->load->library('validation');
$rules['username'] = 'trim|required|callback__check_login';
$rules['password'] = 'trim|required';
$this->validation->set_rules($rules);
$fields['username'] = 'username';
$fields['password'] = 'password';
$this->validation->set_fields($fields);
if ($this->validation->run()) {
$username = $this->validation->username;
$uid = $this->user_model->getUserId($username,"users");
$this->session->set_userdata("logged_in",$uid);
$output = '{ "success": "yes", "welcome": "Welcome" }';
} else {
$output = '{ "success": "no", "message": "This is not working" }';
}
$output = str_replace("\r", "", $output);
$output = str_replace("\n", "", $output);
echo $output;
}
function logout()
{
$this->session->sess_destroy();
redirect("");
}
}
?>
[/code]
Para el login en AJAX vamos a tener que usar una comprobación en PHP que la llamaremos
mediante jQuery. Es tan simple como saber si el usuario que intentamos acceder es válido o no lo
es. Esta función de comprobar el usuario es checkLogin() y la analizamos desde el principio. En
primer termino nos encontramos con:
[code lang="php"]
$rules['username'] = 'trim|required|callback__check_login';
[/code]
Que hace una llamada a la función _check_login(). Es la función que realmente comprueba en al
base de datos si el usuario existe o no en la misma:
[code lang="php"]
function _check_login($username) {
$password = md5($this->validation->password);
if(!$this->user_model->checkUserLogin($username,$password,"users"))
return FALSE;
return TRUE;
}
[/code]
Lo primero que hacemos es obtener la contraseña y codificarla en md5, ya que es como reside en la
base de datos. Mediante el modelo user_model, que analizaremos más adelante, comprobamos con
el nombre de usuario y contraseña que el usuario ha ingresado si coinciden con los que
corresponden. Si esto es verdad, y coinciden, devolveremos un TRUE… del contrario, FALSE.
El modelo que usamos para comprobar el usuario, llamado user_model.php, es muy sencillo. El
código es el siguiente:
[code lang="php"]
db->where("username",$username);
$query = $this->db->where("password",$password);
$query = $this->db->limit(1,0);
$query = $this->db->get($table);
if ($query->num_rows() == 0) {
return NULL;
}
return TRUE;
}
}
?>
[/code]
Simplemente devuelve TRUE o FALSE dependiendo de si son válidos los datos que pasamos a la
función.
Una vez tenemos casi todo el código, es hora de la View donde mostraremos el formulario en AJAX.
Tengo las vistas separadas de modo que pueda cargar un header, el contenido y un footer. Mi
formulario irá al header pero podría funcionar en cualquier otro sitio.
[code lang="php"]

session->userdata('logged_in')) {
?>
Welcome, you're already logged In.
'userlogin'));?>
Username:

Password:
Login

[/code]
Como comprobaciones en medio de la vista nos podemos dar cuenta de la siguiente:
[code lang="php"]
if($this->session->userdata('logged_in')) {
[/code]
Simplemente lo usamos para comprobar si es un usuario que ya ha logeado o si es un nuevo
usuario. Si es nuevo, esta comprobación fallará y nos mostrará el nuevo formulario de login. No
tiene ningún tipo de complicación. Lo que más puede generar dudas es el código de jQuery, que
también es muy simple y son pocas lineas:
[code lang="javascript"]
$(document).ready(
function(){
$("#userlogin").ajaxForm({
type: "POST",
url: "/user/checkLogin",
dataType: "json",
data: "username="+$("#username").val()+"&password;="+$("#password").val(),
success: updateLogin
});
}
)
[/code]
Para usar este tipo de llamada (ajaxForm) vamos a necesitar el plugin jQuery Form que podemos
descargar desde la página del autor. Como curiosidad destacar el success: updateLogin que se
encargará de actualizar nuestro formulario sin necesidad de cargar de nuevo la página. Esta es otra
función a parte que llama una vez ha ejecutado el script. El código es el siguiente:
[code lang="javascript"]
function updateLogin(data) {
$('#logged').html('');
$('#logged').hide();
$("#loginform").fadeOut("slow",
function() {
if (data.success == 'yes') {
$('#logged').html(data.welcome).fadeIn("slow");
}
if (data.success == 'no') {
$('#loginerror').html(data.message).fadeIn("slow").fadeOut("slow",
function() {
$("#loginform").fadeIn("slow");
}
);
}
}
);
}
[/code]
Dependiendo de si el script PHP ha devuelto success == yes o success == no, ejecutará y
actualizará de un modo o de otro. Los data.welcome o data.message son los mensajes que hemos
enviado usando JSON a la hora de validar el script en el controlador user.php.
Bien, espero que con esto puedan crear su primer login en AJAX usando jQuery y PHP. Pronto, más
sobre AJAX, PHP y CodeIgniter!
AJAX, ajax login, CodeIgniter, jQuery, mysql, php