Comunidad de diseño web y desarrollo en internet online

Introducción a Codeigniter

Buenas mis queridos amigos, en esta ocasión les traigo una primera parte de cómo usar el framework Codeigniter 2.1.3. En esta primera parte veremos cómo realizar las configuraciones básicas, uso de las views de Codeigniter, y guardado de datos desde un formulario utilizando la clase Active Record de codeigniter para esto.



Codeigniter es un framework orientado a objetos, aplicando el patrón de diseño Modelo-Vista-Controlador. Primeramente empezamos descargando Codeigniter desde la pagina oficial. Deben descomprimirlo, renombrar la carpeta con el nombre del proyecto y subirlo a su hosting favorito, en nuestro caso se llamará "videos", el cual será un catálogo de un videoclub.

Una vez realizado este proceso tendremos el siguiente árbol de archivos:

Reconocemos dos carpetas: application y system; nosotros trabajaremos exclusivamente dentro de la carpeta application.

Controladores


Ahora empezaremos viendo un poco el funcionamiento de los controladores y las url para acceder a dichos controladores. Lo primero que haremos es crear un archivo dentro en la dirección "application/controller/" con el nombre inicio.php.

En este archivo "inicio.php" tendremos el siguiente código:

Código :

<?php
class Inicio extends CI_Controller {
   function __construct()
   {
      parent::__construct();
   }
   function index()
   {
      echo "Hello CodeIgniter";
   }
}

Note que la herencia se realiza desde la clase "CI_Controller". Este es un cambio que realizó Codeigniter desde su versión 2.0, en versiones anteriores a esta la herencia se la realizaba desde la clase "Controller". Notar que dentro de codeigniter el nombre de la clase es el mismo que el nombre del archivo con la variación de que el primer carácter del nombre de la clase tiene que estar en mayúscula.

Seguidamente creamos el constructor de la clase, dentro del cual se van cargando librerías helpers que ayuden en la realización del proyecto. Después tenemos una función index, el cual se va cargando automáticamente al ingresar a cualquier controlador.

Para ver el funcionamiento del controlador lo único que tenemos que realizar es ingresar a la dirección de nuestro hosting, en mi caso como estoy usando wampserver de forma local ingreso a la dirección http://127.0.0.1/videos/, teniendo el siguiente resultado:



Para ingresar al controlador lo que tenemos que hacer es aumentar el nombre del archivo creado, en este caso "inicio", sin la extensión del archivo, entonces tendremos la url http://127.0.0.1/videos/inicio/, en la cual tendremos como resultado un error de página no encontrada "No Found". El error viene dado ya que el framework nos pide indicar un archivo más "index.php". Antes de ingresar al controlador, con la aclaración realizada tendremos como url la siguiente dirección: http://127.0.0.1/videos/index.php/inicio/, en el cual tenemos como resultado: "Hello Codeigniter", que es lo que se definimos en la función index del controlador, ya que esta función es la que se carga automáticamente una vez que se ingresa al controlador.

Ahora crearemos dos funciones una que imprima un nombre y otra que reciba una variable y también lo imprima:

Código :

function nombre()
{
   echo "Nombre: Roger";
}
function nombre_uno($nom)
{
   echo $nom;
}

Se crean dos funciones de ejemplo para ver el funcionamiento de los controladores dentro de codeigniter, una función nombre, el cual sólo imprime un string, y una segunda función con el nombre nombre_uno que recibe un parámetro $nom y dentro de ésta imprime dicho parámetro.

Para ingresar a las diferentes funciones dentro del controlador sólo tenemos que agregar el nombre de la función a final de la url que ya se tenía. Para la primera función llamada nombre la dirección sería: http://127.0.0.1/videos/index.php/inicio/nombre/, para la segunda función creada se debe notar que ésta recibe un parámetro, para enviar parámetros a una función lo que hacemos es aumentar el valor al final de la dirección, es decir después del nombre del controlador: http://127.0.0.1/videos/index.php/inicio/nombre_uno/parametro/, teniendo como resultado la impresión de "parametro" ya que dentro de la función el parámetro toma el valor del string "parametro".

Ya entendiendo un poco el funcionamiento de los controladores en este framework, proseguiremos con eliminar de la dirección el "index.php" ya que muchas veces es un poco molesto dejarlo así.

Eliminar el Index.php


Lo primero que tenemos que hacer es crear un archivo ".htaccess" en el directorio raíz:

Dentro del cual tenemos el siguiente código:

Código :

RewriteEngine on
RewriteCond $1 !^(index\.php|css|js|images|robots\.txt)
RewriteRule ^(.*)$ index.php/$1 [L]

Lo que realizará este código es evitar que estemos poniendo el index.php en las direcciones, con el cual se obtiene url's más limpias, además de que la segunda línea de código nos da acceso a diferentes carpetas dentro del directorio raíz como son "css - js - images".

Ahora lo que tenemos que hacer es acceder al archivo de configuración ubicado en el directorio "application/config/config.php", en el cual sólo modificaremos el archivo buscando la siguiente línea de código ubicada alrededor de la línea 29:

Código :

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

Dejándola de la siguiente forma:

Código :

$config['index_page'] = '';

Con estos cambios las url's cambiarán. Para ingresar a la función "nombre" dentro del controlador "inicio" la url sería: http://127.0.0.1/videos/inicio/nombre/, y ya no hay necesidad de poner el "index.php".

OjO: Para que el archivo ".httacces" empiece a funcionar debemos activar un módulo dentro de apache --rewrite_module -- reiniciar el servicio y listo.


VISTAS


Ahora veremos un poco el funcionamiento de las views dentro de codeigniter, para ello tenemos que hacer algunas configuraciones dentro del archivo "config.php", buscando la siguiente línea de código ubicada alrededor de la línea 17:

Código :

$config['base_url']   = '';

Dejándola de la siguiente manera:

Código :

$config['base_url']   = 'http://127.0.0.1/videos/';

Esta configuración "base_url" nos ayudará a enlazar los archivos .css, .js e imágenes que requiera nuestro proyecto, ya que esta es la dirección de nuestro proyecto ya sea de forma local, o ya sea en funcionamiento dentro de un servidor, para el segundo caso cuando el proyecto se encuentre en un servidor, la dirección que se utiliza es la dirección IP asignada a la máquina o el dominio asignado, esto nos ayudará ya que cualquier cambio en la dirección del proyecto, el cambio ya no tendrá que ser en diferentes lugares del proyecto sino solamente en un solo lugar.

Para que podamos usar el "base_url" dentro de las vistas debemos hacer cambios en el archivo "autoload.php" que se encuentra en la dirección "application/config/autoload.php", alrededor de la línea 67 tenemos el siguiente código:

Código :

$autoload['helper'] = array();

Dejando esta línea de la siguiente manera:

Código :

$autoload['helper'] = array('url');

Configurar este archivo nos ayuda a cargar automáticamente algunas clases de codeigniter como ser helpers, librerías, etc. Esto nos es muy útil ya que si no tendríamos que cargar estas clases desde cada controlador, en este caso cargamos el "helper form" de codeigniter que es el encargado de gestionar las direcciones de nuestro proyecto y hacer que el manejar los enlaces sea más fácil y divertido.

Ahora lo que haremos es utilizar un plantilla HTML realizada en uno de los streaming de Mejorando la web , el cual lo adaptaremos para que nos muestre nuestro catálogo de videos. GRACIAS A MEJORANDO LA WEB.

Primeramente creamos un archivo en la dirección "application/views/" con el nombre "plantilla.php" -dentro de codeigniter todos los archivos tienen que tener la extensión .php-, creamos dos carpetas en el directorio raíz (css, images), ponemos el archivo "estilos.css" en la carpeta "css" y copiamos los archivos de imagen "logo.png" y "web.jpg" dentro de la carpeta "images", quedando de la siguiente manera:

Ahora para que Codeigniter pueda enlazar a estos archivos debemos añadir el "base_url()" antes de acceder a cualquier archivo, es decir que si queremos enlazar al archivo "estilos.css" que se encuentra dentro de la carpeta css la referencia tiene que ser de la siguiente manera:

Código :

<link rel="stylesheet" href="<?php echo base_url()?>css/estilos.css"/>

Explicando un poco el código anterior hacemos una referencia normal a un archivo css, pero en la ubicación del archivo vamos poniendo una de las formas de utilizar código php dentro de una vista. Más adelante veremos otra forma de realizar esta operación, lo que esta haciendo
<?php echo base_url()?>
, es imprimir el contenido añadido anteriormente, con el cual la dirección del archivo dentro del navegador sería la siguiente:
  • http://127.0.0.1/videos/css/estilos.css

...que es la forma en la que codeigniter realiza el enlace con archivos.

Ahora tenemos que hacer el mismo proceso para enlazar a la imagen "logo.png" dentro del carpeta "images". El código a utilizar sería el siguiente:

Código :

<img src="<?php base_url()?>images/logo.png"/>

...que tiene el mismo funcionamiento que lo explicado anteriormente con el archivo "estilos.css".

Con las explicaciones anteriores y adaptando la plantilla a nuestras necesidades tenemos el siguiente código:

Código :

<!doctype html>
<html lang="es">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width = device-width, initial-scale=1, maximum-scale=1"/>
<title>Catalogo Videos</title>
<link rel="stylesheet" href="<?php echo base_url()?>css/estilos.css"/>
</head>
<body>
   <section id="contenedor">
      <nav>
         <ul>
            <li><a href="#index"><img src="<?php echo base_url()?>images/logo.png"/></a></li>
            <li><a href="#contacto">registrar video</a></li>
            <li><a href="#contacto">contacto</a></li>
            <li><a href="#contacto">registrar Usuario</a></li>
         </ul>
      </nav>
      <header id="datos">
         <div class="personales">
            <h1>Nuestro Videos</h1>
            <h2>Catalogo Online</h2>
         </div>
      </header>
      <section id="websites">
         <article>
            <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
            <p>Titulo Video</p>
            <p>Costo Video</p>
            <p>formato Video</p>
         </article>
         <article>
            <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
            <p>Titulo Video</p>
            <p>Costo Video</p>
            <p>formato Video</p>
         </article>
         <article>
            <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
            <p>Titulo Video</p>
            <p>Costo Video</p>
            <p>formato Video</p>
         </article>
         <article>
            <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
            <p>Titulo Video</p>
            <p>Costo Video</p>
            <p>formato Video</p>
         </article>
         <article>
            <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
            <p>Titulo Video</p>
            <p>Costo Video</p>
            <p>formato Video</p>
         </article>         
      </section>
                <footer>
            Este es nuestro pie de pagina 
             copyright &copy 2013
           </footer>
   </section>
</body>
</html>

Aclarando que no se harán explicaciones del código HTML o CSS ya que estas se encuentran explicados en el video de Mejorando la web .

Ahora para poder utilizar esta plantilla lo primero que tenemos que hacer es modificar nuestro controlador "inicio.php" en la función index para que pueda cargar la plantilla.

La forma de cargar plantillas o vistas en codeigniter es la siguiente:

Código :

$this->load->views('nombre_vista')

Notar que al cargar una vista no se especifica la extensión que esta posee.
Entonces la función index dentro del controlador "inicio" quedaría de la siguiente manera:

Código :

function index()
{
   $this->load->view('plantilla');
}

Ingresando a la dirección http://127.0.0.1/videos/inicio tenemos como resultado:

Ahora una de las ventajas de usar codeigniter es que nos da la posibilidad de cargar varias vistas al en una sola función, es decir que podemos dividir nuestra plantilla en varios archivos y cargarlas desde el controlador y codeigniter se encarga de unir los archivos de plantilla, esto es útil para ya no estar escribiendo el mismo código una y otra vez dentro de cada vista.

El archivo "plantilla.php" lo dividiremos en 3 archivos que los crearemos en el mismo lugar que la plantilla, archivos que llamaremos "header.php", ''cuerpo.php" y "footer.php" los cuales tienen el siguiente contenido:

Archivo "header.php"

Código :

<!doctype html>
<html lang="es">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width = device-width, initial-scale=1, maximum-scale=1"/>
<title>Catalogo Videos</title>
<link rel="stylesheet" href="<?php echo base_url()?>css/estilos.css"/>
</head>
<body>
   <section id="contenedor">
      <nav>
         <ul>
            <li><a href="#index"><img src="<?php echo base_url()?>images/logo.png"/></a></li>
            <li><a href="#contacto">registrar video</a></li>
            <li><a href="#contacto">contacto</a></li>
            <li><a href="#contacto">registrar Usuario</a></li>
         </ul>
      </nav>
      <header id="datos">
         <div class="personales">
            <h1>Nuestro Videos</h1>
            <h2>Catalogo Online</h2>
         </div>
      </header>

El archivo "cuerpo.php"

Código :

<section id="websites">
<article>
<img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
   <p>Titulo Video</p>
   <p>Costo Video</p>
   <p>formato Video</p>
</article>
<article>
   <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
   <p>Titulo Video</p>
   <p>Costo Video</p>
   <p>formato Video</p>
</article>
<article>
   <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
   <p>Titulo Video</p>
   <p>Costo Video</p>
   <p>formato Video</p>
</article>
<article>
   <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
   <p>Titulo Video</p>
   <p>Costo Video</p>
   <p>formato Video</p>
</article>
<article>
   <img src="<?php echo base_url()?>images/web.jpg" alt="la mejor web del mundo" height="150" width="150"/>
   <p>Titulo Video</p>
   <p>Costo Video</p>
   <p>formato Video</p>
</article>
</section>

El archivo "footer.php"

Código :

      <footer>
      Este es nuestro pie de pagina 
      copyright &copy 2013
   </footer>
   </section>
</body>
</html>

Hemos dividido el archivo "plantilla.php" en tres archivos diferentes, aclarando que la unión de los tres archivos deben formar un archivo HTML completo (recordar que deben cerrar todas las etiquetas abiertas, no importa que éstas se cierren en otros archivos, no solamente se puede dividir en tres archivos, se puede dividir en mas archivos, se debe dividir la plantilla HTML en los archivos que cada uno vea necesario).

Ahora debemos modificar la función index dentro del controlador "inicio.php" dejándola de la siguiente manera:

Código :

function index()
{
   $this->load->view('header');
   $this->load->view('cuerpo');
   $this->load->view('footer');
}

Accediendo a la dirección http://127.0.0.1/videos/inicio vemos que tenemos el mismo resultado obtenido anteriormente, ahora lo único que tenemos que ir cambiando es la la vista cuerpo para las diferentes funcionalidades del proyecto.

Funcionalidades de las vistas


Dentro de las vistas podemos usar código php de dos formas, la primera ya la vimos anteriormente, ahora veremos la segunda forma o una forma resumida de realizar este proceso, para esto debemos activar una opción en php, primeramente debemos abrir el archivo php.ini de nuestro servidor y activar la opción "short_open_tag=on" que por lo general viene desactivada. Reiniciamos el servicio y listo. Una vez realizado la activación dentro del archivo "php.ini", podemos realizar esto dentro de nuestras views:

Código :

<!--antes-->
<?php echo "Esto es una cadena" ?>
<!--ahora-->
<?= "Esto es una cadena" ?>

Como se puede observar ya no hay necesidad de usar el "echo" para imprimir dentro del código php, eso es reemplazado por el símbolo igual "=", esto es de gran ayuda ya que el código a escribir es más corto.

Enviar variables a una vista


La forma de enviar variables a una vista es muy sencilla, basta con crear un array para poder enviar las diferentes variables a la vista, por ejemplo si yo tengo el siguiente array:

Código :

$variables['var1'] = "valor1";
$variables['var2'] = "valor2";
$variables['var3'] = "valor3";

...me basta con enviar con "$variables" al vista para poder acceder a todos los valores que posea, aclarando que dentro de la vista se podrá acceder a los diferentes valores mediante el nombre que posee la posición en el array, es decir que para acceder al string "valor1" dentro de la vista debemos imprimir "var1" pero esta es reconocida como una variable: "var1" dentro de la vista será "$var1", y así sucesivamente podemos acceder a los diferentes valores dentro de las vistas.

La forma de enviar este array a una vista es sumamente fácil ya que sólo hace falta agregar el array después de cargar la vista dentro de la función "nombre" en el controlador "inicio.php", es decir que la función quedaría de la siguiente manera;

Código :

function nombre()
{
   $variables['var1'] = 'valor1';
   $variables['var2'] = 'valor2';
   $variables['var3'] = 'valor3';
   $this->load->view('header');
   $this->load->view('inicio/cuerpo_nombre', $variables);
   $this->load->view('footer');
}

Como podemos observar hemos enviado las variables a la vista "cuerpo_nombre" de forma sencilla y sin complicaciones, ahora debe aclarar que si queremos que estas variables estén presentes en la vista "header", también debemos enviar el array, ya que si no lo hacemos no podremos acceder a estas aunque al final codeigniter une las tres vistas, la vista "cuerpo_nombre" se encontrará dentro de la carpeta "inicio". Esa es la razón por la que se le da esa dirección "inicio/cuerpo_nombre".

Ahora creamos la carpeta "inicio" en la dirección "application/views/" y creamos el archivo "cuerpo_nombre.php" dentro de dicha carpeta, el cual tendrá el siguiente código:

Código :

<p><?= $var1?></p>
<p><?= $var2?></p>
<p><?= $var3?></p>

Ahora dentro de esta vista lo único que estamos haciendo es imprimir cada una de las variables dentro de párrafos, ingresando a la dirección http://127.0.0.1/videos/inicio/nombre tenemos el siguiente resultado:

Ahora veremos un poco las sentencias de control dentro de las vistas.

Sentencias de control en las vistas


Tenemos varias sentencias de control.

Sentencia If - else

La forma de utilizar la sentencia if - else dentro de la vista tiene la siguiente estructura:

Código :

<? if (condicion): ?>
      si la condición es verdadera
<? else: ?>
      si la condición es falsa
<? endif ?>

Note que al usar esta estructura de control ya no hay necesidad de usar el símbolo de llaves "{ }" para agregar las instrucciones una vez que la condición sea falsa o verdadera, también se debe agregar el símbolo de dos puntos ":" después de la condición "if" o en caso contrario después de "else" y se termina o en este caso se cierra la condición usando "endif".

Sentencia foreach

La forma de utilizar la foreach dentro de una vista en codeigniter tiene la siguiente estructura:

Código :

<? foreach ($variable as $key => $value): ?>
     #codigo
<? endforeach ?>

Al igual que en la sentencia de control if - else no hay la necesidad de usar el símbolo de llaves "{ }" para agregar las instrucciones dentro de la sentencia, también se debe utilizar el símbolo de dos puntos ":" después de la sentencia foreach y terminar la sentencia usando "endforeach".

Ahora un ejemplo del uso de estas dos sentencias de control:
Primeramente crearemos una nueva función dentro del controlador inicio en cual tendremos una variable entera, y un array que enviaremos a una vista, teniendo así el siguiente código:

Código :

function sentencias()
{
   $var = 2;
   $vector = array( 
               "uno" => 1, 
               "dos" => 2,
               "tres" => 3,
               "diecisiete" => 17,
         );
   $data['var'] = $var;
   $data['vector'] = $vector;
   $this->load->view('header');
   $this->load->view('inicio/sentencias_control', $data);
   $this->load->view('footer');
}

Primeramente crearemos una vista dentro del directorio "application/views/inicio" con el nombre "sentencias_control.php".

Ahora dentro de la vista lo que haremos es preguntar si la variable "$var" es par o impar con la sentencia de control "if - else", y recorreremos los datos del array con la sentencia de control "foreach", teniendo así el siguiente código:

Código :

<? if($var % 2 == 0): ?>
   <p>Es Numero par</p>
<? else:?>
   <p>No es Numero Par</p>
<? endif ?>
<br><br>
<? foreach ($vector as $valor):?>
   <p><?= $valor ?></p>
<? endforeach ?>

Entrando a la dirección http://127.0.0.1/videos/inicio/sentencias, podremos observar el resultado que deseamos para ver un poco el funcionamiento de las sentencias de control dentro de las views.

Trabajando con formularios


Teniendo ya una base de conocimientos del funcionamiento de los controladores y las views, ahora realizaremos un formulario para el ingresar una pequeña información de cada video para nuestro catálogo.
Lo primero que hacemos es crear la base de datos. Para nuestro caso la base de datos se llamará "videos_db", y dentro de ésta una tabla con el nombre "info_video", el código de la tabla en mysql:

Código :

CREATE TABLE IF NOT EXISTS `info_video` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
  `titulo` varchar(100) NOT NULL,
  `costo` float NOT NULL,
  `formato` varchar(20) NOT NULL,
  `portada` varchar(200) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Tenemos los campos básicos dentro de nuestra tabla, el título del video el costo de éste, el formato en que se encuentra y la portada que es la imagen de presentación de cada video.

Ahora que ya tenemos nuestra base de datos lo siguiente que haremos es configurar la conexión a la base de codeigniter, para ello abrimos el archivo "database.php" ubicado en la dirección "application/config/database.php", y al final del archivo le damos nuestra configuración, quedando de la siguiente forma;

Código :

$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';
$db['default']['password'] = '';
$db['default']['database'] = 'videos_db';
$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';
$db['default']['swap_pre'] = '';
$db['default']['autoinit'] = TRUE;
$db['default']['stricton'] = FALSE;

No explicaremos cada variable ya que su propio nombre lo dice todo.
Una vez realizado esto procedemos a abrir el archivo "autoload.php", ubicado en la dirección "application/config/autoload.php", y buscamos alrededor de la línea 54:

Código :

$autoload['libraries'] = array();

Esta línea es la que carga automáticamente las librerías para todo el proyecto, en este caso cargaremos la librería "database" para yo no estar agregándola en cada controlador, quedando el código de la siguiente forma:

Código :

$autoload['libraries'] = array('database');

El la misma ubicación el archivo "autoload.php" abrimos el archivo "routes.php" y alrededor de la línea 41 tenemos el siguiente código:

Código :

$route['default_controller'] = "welcome";

Esta línea de código lo que nos hace es dirigirnos automáticamente a un controlador que por defecto nos dirige al controlador "welcome", para nuestro caso lo cambiaremos por el controlador "video", que crearemos posteriormente, y con esto ya tenemos las configuraciones para empezar a manejar la base de datos.

Ahora creamos un nuevo archivo "video.php" que será nuestro controlador que maneja el formulario de registro, lo creamos en la dirección "application/controller/", que tendrá el siguiente código:

Código :

<?php
class Video extends CI_Controller {

   function __construct()
   {
      parent::__construct();
      $this->load->helper('form');
      $this->load->model('video_model');
   }

   function index()
   {
      $data['videos'] = $this->video_model->select_videos();
      $this->load->view('header');
      $this->load->view('video/catalogo', $data);
      $this->load->view('footer');
   }
   function new_video($error = '')
   {
      $data['error'] = $error;
      $this->load->view('header');
      $this->load->view('video/new_video', $data);
      $this->load->view('footer');
   }
   function save()
   {
      $config['upload_path'] = './images/portada/';
      $config['allowed_types'] = 'jpg|JPG|jpeg|JPEG|png|PNG';
      $config['remove_spaces'] = TRUE;
      $config['max_size'] = '1024';
        
      $this->load->library('upload', $config); 
      if ( ! $this->upload->do_upload())
      {
         $error = $this->upload->display_errors();
         $this->new_video($error);
      }
      else
      {
         $data = $this->upload->data();
         $titulo = $this->input->post('titulo');
         $costo = $this->input->post('costo');
         $formato = $this->input->post('formato');
         $portada = $data['file_name'];
         $insert = $this->video_model->insert($titulo, $costo, $formato, $portada);
         if($insert)
         {
            redirect('/video/', 'refresh');
         }
         else
         {
            $this->new_video();
         }
      }
   }
}

Explicaremos un poco lo que hace nuestro controlador.
Primeramente dentro de la función constructor estamos cargando un helper con el código "$this->load->helper()" que es la forma de cargar helpers, y el helper "form", que es el que nos ayuda a interactuar con formularios, y crearlos de manera divertida. Posteriormente cargamos un modelo "$this->load->model()" que es la forma de cargar modelos, el model "video_model" que será el encargado de guardar los datos de los formulario y extraer datos desde nuestra tabla.

La función index lo que hace es conectarse con el modelo para que pueda mandar la respuesta de la consulta a la vista "catalogo" que tenemos que crearla dentro de la carpeta "views/video/", el cual tiene el siguiente código;

Código :

<section id="websites">
   <? foreach ($videos as $catalogo):?>
      <article>
         <img src="<?php echo base_url()?>images/portada/<?=$catalogo->portada?>" alt="la mejor web del mundo" height="150" width="150"/>
         <p><?= $catalogo->titulo?></p>
         <p><?= $catalogo->costo?></p>
         <p><?= $catalogo->formato?></p>
      </article>
   <? endforeach?>
</section>

Lo único que hace esta vista es recorrer los diferentes datos de la consulta generada por el modelo.

Ahora en la función "new_video" lo que primero que vemos es que recibe un parámetro que nos mostrará los errores que puedan existir al momento de subir las imágenes. En caso de que no se enviara el parámetro, éste ya tiene un valor predeterminado. Ahora la vista "new_video" es un archivo que tenemos que crearlo dentro de la dirección "application/views/video", ésta tiene el siguiente código:

Código :

<h4>Seleccione una imagen un tamaño no mayor a 1Mb<h4>
<p><?=$error?></p>
<?= form_open_multipart('video/save');?>
   <p>
      <?=form_label('Titulo Video:', 'titulo')?>
      <?= form_input('titulo');?>
   </p>
   <p>
      <?=form_label('Costo Video:', 'costo')?>
      <?= form_input('costo');?>
   </p>
   <p>
      <?=form_label('Formato Video:', 'formato')?>
      <?= form_input('formato');?>
   </p>
   <?=form_label('Seleccione una Imagen', 'image')?>
   <input type="file" name="userfile" size="20" />
   <br><?= form_submit('Guardar', 'Guardar')?>
<?=form_close()?>

Explicando un poco la vista, vemos que para crear el formulario usamos un "form_open_multipart()" que es la forma de crear formularios para subir archivos usando el helper "form" ahora dentro del paréntesis. Lo que introducimos es el nombre de controlador y la función a la cual será enviada la información, el helper ya es el encargado de poner la dirección completa de la ubicación del archivo y datos adicionales necesarios para la creación y funcionamiento de un formulario. Este formulario se debe cerrar con la sentencia "form_close()", esto nos creará la estructura básica de un formulario lista para funcionar, ahora lo que sigue es explicar un poco la forma de cómo se van creando los labels e inputs con el helper.

Para crear un label utilizamos el código "form_label()", que para nuestro caso recibe dos parámetros, el primero que es el texto que mostrará el label y el segundo el atributo "for" de un label. Para crear un input utilizamos el código "form_input()" que para nuestro caso recibe un parámetro que es "name" del input, se pueden pasar más parámetros a los inputs pero para ello se debe usar un array, y por último vemos cómo crear un input de tipo submit para el cual se utiliza el código "form_submit()", que para nuestro caso recibe dos parámetros: el primero el name del input, el segundo parámetro el value del input

Con esto vimos de forma general la forma de crear un formulario usando el helper "form" de codeigniter.

Siguiendo con el controlador video, vemos ahora la función "save" que es la encargada de subir los archivos, y guardar la información en la base de datos. Creamos un array con las configuraciones básicas que requiere la librería "upload" que es la encargada de subir archivos. Lo primero que configuramos es la ruta en la que se guardarán las imágenes, es decir que tenemos que crear la carpeta "portada" con los permisos de escritura, lectura y ejecución dentro de la carpeta "images" en el directorio raíz del proyecto.

La segunda configuración es los tipos de archivo permitidos para que puedan ser subidos, en nuestro caso formatos de imagen.

En la tercera configuración activamos la opción de remover espacios del nombre de la imagen, y por último configuramos el tamaño máximo del archivo en Kb que se puede subir. Luego inicializamos la librería "upload" mandando las configuraciones realizadas anteriormente. Con la siguiente línea de código preguntamos dentro de la sentencia "if" si el archivo no se subió dentro de la sentencia, asignamos el error generado a la variable "$error" y lo enviamos nuevamente a la función "new_video", caso contrario de que el archivo se haya sido subido correctamente, mandamos toda la información del archivo subido a la variable $data.

Posteriormente recuperamos la información del formulario en diferentes variables, llegando al punto de la variable "$portada" en la cual almacenamos el nombre del archivo subido junto con el formato que posee con la línea de código "$data['file_name'}" -recordar que la variable "$data" tiene toda la información del archivo que se subió.

Luego asignamos a la variable "$insert" el resultado de la consulta realizada en modelo "video_model" y dentro de ésta la función "insert" a la cual se le mandan como parámetros todas las variables necesarias para la tabla, preguntado dentro de la sentencia "if" si la variable es verdadera, redireccionamos el controlador utilizando el código "redirect('\ \', 'refresh');", dentro del cual el primer parámetro que recibe es la dirección a la cual ir, para nuestro caso el controlador "video" y si se requiere la función, caso contrario que no se haya guardado la información en la base de datos volvemos a la función "new_video", así explicamos todo el funcionamiento del controlador "video".

Modelos


Ahora veremos un poco el funcionamiento del modelo utilizado anteriormente, para ello lo primero que tenemos que realizar es crear el archivo "video_model" en la dirección "application/model/". Tengamos en cuenta que estos pueden tener cualquier nombre y no necesariamente terminar con model, dentro de este modelo tendremos el siguiente código:

Código :

<?php 
class Video_model extends CI_Model {

   function select_videos()
   {
      $query = $this->db->get('info_video');
      if($query->num_rows() > 0)
      {
         foreach ($query->result() as $fila)
         {
            $data[] = $fila;
         }
         return $data;
      }
      else
      {
         return False;
      }
   }
   function insert($titulo, $costo, $formato, $portada)
   {
      $data = array(
               'titulo' => $titulo,
               'costo' => $costo,
               'formato' => $formato,
               'portada' => $portada,
          );
      return $this->db->insert('info_video',$data);
   }
}

Primeramente vemos que la clase de este modelo hereda desde la clase CI_Model. Dentro de esta tenemos una primera función "select_videos" en cual seleccionamos todos los videos desde la base de datos, para ello asignamos a la variable "$query" el resultado de la consulta, ya que utilizando la clase "Active Record" de codeginiter el código es "$this->db->get(' ');" que recibe como parámetro el nombre de la tabla de la que se quiere extraer datos.

Esta línea de código lo que genera es una consulta "select". Para nuestro caso, en mysql si usáramos postgresql generaría una consulta "select" para postgresql. En la sentencia "if" preguntamos si el número de filas es mayor a cero utilizando el código "num_rows()" seguido a la variable que posee la consulta. Dentro de un "foreach" recorremos el resultado de la consulta "result()" seguido de la variable que posee la consulta y asignamos dicho resultado a una variable "$data". Terminado este proceso retornamos la variable, caso contrario que no haya datos en la consulta retornamos "False".

Dentro de la función "insert" que recibe los parámetros para guardarlos en la base de datos, primeramente creamos un array en cual especificamos el nombre de cada campo de la tabla y le asignamos la variable correspondiente, y devolvemos el resultado de la consulta en este caso el resultado de la inserción, dicha inserción se la realiza utilizando la línea de código "$this->db->insert()" que recibe dos parámetros: el primero el nombre de la tabla, y el segundo el array creado con la información del formulario.

Creado todos los archivos ingresamos a la dirección http://127.0.0.1/videos/video/new_video y tendremos el formulario de registro de videos para nuestro catálogo para hacer el guardado de la información de los videos.

Los archivos del proyecto se encuentran en github incluyendo un archivo .sql con la tabla que usamos para el proyecto no se olviden realizar las configuraciones a la base de datos para que lo puedan utilizar.

Con esto concluye este tutorial de Introducción a Codeigniter, ya en siguientes tutoriales veremos un poco más del manejo de la clase "Active Record" para la utilización de consultas, veremos el funcionamiento de la librería "form_validation" para la validación de formularios de forma sencilla y enlazar las direcciones del menú.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate