DesarrolloLibre

Desarrollo Web, Android, juegos y mucho más

¡Actualizado el 21-06-2017!

En esta entrada se explicará el uso en general de una estupenda herramienta o mejor dicho librería (para respetar el modo de integración de esta herramienta a CodeIgniter) que permite crear una completa y compleja (hasta cierto punto) de tablas administrativa (con esto nos referimos a tablas con búsqueda, por campos, paginación, ordenación e importación) empleando unas pocas líneas de código como las siguientes:

$crud = new grocery_CRUD();
 
$crud->set_theme('bootstrap');
$crud->set_table('contactos');
$output = $crud->render();

Este vendría siendo el resultado:

Además de la tabla administrativa muy útil de por si, también crea las funcionalidades de crear, actualizar y eliminar registros; lo que es un sistema CRUD.

jQuery datatable como elemento central

Como veras si algunas vez has empleado las estupendas tablas de jQuery datatable son las usadas internamente para generar las tablas de la librería de grocery CRUD son las mismas; en general, lo "malo" de usar estas tablas o plugin jQuery, es que requieren bastante configuración, entre el mismo JavaScript, con la conexión del JSON -que es el mejor esquema que podríamos emplear (o similar)-, armar cada una de las columnas, dar formato a la tabla y desarrollar el servicio del JSON, el nombrado de las funciones y parámetros una y otra versión tienden a cambiar los métodos, etc.

Grocery CRUD nos ayuda en todo esto y para crear nuestro "núcleo" o elementos fundamentales para mostrar las tablas y CRUD (por sus siglas en inglés de: Create, Read, Update and Delete) que tendríamos que hacer a mano; apenar tendríamos que emplear algunas pocas líneas de código como las siguientes:

  • Crear nuestro controlador que nos devuelve un JSON para que se alimente la tabla (y todo lo que esto conlleva, como la creación de la consulta en el modelo).
  • Cargar los plugins en nuestra vista.
  • Definir las columnas que definimos en nuestro modelo y atarlas en la vista (siempre hay más de un problema en esta parte).
  • Crear todo el JavaScript para realizar operaciones especiales: como la de modificación del registro listado, eliminar...

Cuando nos damos cuenta, tenemos nuestra estupenda tabla jQuery datatable con un montón de JavaScript y por ende se complica cuando queremos realizar modificaciones en la tabla y ni hablar si tenemos que replicar para varias tablas o CRUD en el sistema que estemos desarrollando.

La librería de grocery CRUD para CodeIgniter al rescate

Codeigniter rescate

La gente de grocery CRUD se les ocurrió una estupenda idea la cual es crear una librería para CodeIgniter (viene el desarrollo para Zend en camino según especifican: en su hoja de "Futuras características") que ha simplificado todo lo mencionado anteriormente a esas simples líneas de código que vimos anteriormente:

Grocery CRUD no solo crea la jQuery datatable, si no también el completo CRUD de los registros.

Trabajando con Grocery CRUD

Ahora expliquemos cada una de las líneas vistas en un principio de esta entrada.

Instanciando la tabla Grocery CRUD

Primero creamos una instancia de la tabla con:

$crud = new grocery_CRUD();

Selección de la tabla

Para seleccionar el origen de nuestra data (que viene siendo una tabla o vista) se emplea el método $crud->set_table(NombreTabla); por ejemplo, para seleccionar la tabla 'contactos' haríamos algo como esto: $crud->set_table('contactos').

Carga de columnas

Es muy posible que no deseemos mostrar todo el contenido de la tabla de nuestra base de datos en nuestra tala administrativa y solo mostrar algunas columnas en particular; para esto empleamos: $crud->columns(Columnas); por ejemplo, para seleccionar un grupo de nuestras columnas:

$crud->columns('nombre', 'apellido', 'correo', 'telefono', 'cif', 'enombre', 'suspendida')

Campos de edición/creación

También es posible que los campos de las columnas de las tablas no sean los mismos que los campos de creación y/o edición de un nuevo registro; para ello empleamos el método field:

$crud->fields('cliente', 'apellido', 'telefono', 'correo', 'user_id');

Cláusulas Where para filtrar datos

Si no deseas traer todos los registros de una tabla, si no aquellos que cumplan una condición en específico, podemos emplear la cláusula where de la siguiente manera:

$crud->where('procesado_numero', NULL);

Desactivar operaciones del CRUD

Como podemos ver, la tabla por defecto ofrece un CRUD completo sobre todos los datos; si queremos limitar esto tenemos una serie de métodos que debemos emplear para cada situación; por ejemplo, si no deseas permitir la eliminación de registros:

$crud->unset_delete();

O ver los registro que en realidad no es muy útil:

$crud->unset_read();

O actualizar los registros

$crud->unset_edit();

Ejecutando eventos al insertar nuevos registros

También existe un método callback que se ejecuta antes de insertar registros en base de datos y después de insertar registros en base de datos; esto es particularmente útil si necesitamos rellenar algunos campos de manera autogenerada; por ejemplo:

$crud->callback_before_insert(array($this, 'before_estados_callback'));

Y el método tiene la siguiente estructura:

function before_estados_callback($post_array) {
 
    $post_array['user_id'] = $this->session->userdata('id');
    return $post_array;
}

Como puedes ver, al calback se le pasa como parámetro todos los datos que definimos en el formulário.

El callback para ejecutar operaciones luego de la inserción:

$crud->callback_after_insert(array($this, 'after_cliente_callback'));
 
...
 
function after_cliente_callback($post_array, $pk) {
 
     $user = $this->Users->find($post_array['user_id']);
     $this->emails->registro($post_array['cliente'].' '.$post_array['apellido'], $user->passwd_inicial, $post_array['email']);
     return $post_array;
 }

Aquí hay un parámetro extra que corresponde la identificador del registro insertado.

Lógicamente existen métodos callbacks para la actualización y borrado de registros:

$crud->callback_before_update(array($this, 'before_cliente_update_callback'));
$crud->callback_after_update(array($this, 'after_cliente_update_callback'));
$crud->callback_before_delete(array($this, 'before_cliente_delete_callback'));
$crud->callback_after_delete(array($this, 'after_cliente_delete_callback'));

Creando nuestras propias acciones o funcionalidades en Grocery CRUD

También podemos asociar el registro a una acción en específico que no forma parte del CRUD como tal, por ejemplo, actualizar manejar un estatus; para esto se emplea el siguiente código:

$crud->add_action('Suspender', '', 'admin/supender_contacto', 'ui-icon-check');
  • El primer parámetro corresponde al nombre de la acción.
  • Una URL para una imagen.
  • Esta corresponde a la acción a invocar para este parámetro:
            function supender_contacto($id) {
            $this->load->model('Mempresa_contacto');
            $this->session->set_flashdata('tipo_m', 'success');
            $this->session->set_flashdata('text', 'Cuenta suspendida.');
            $this->Mempresa_contacto->suspender($id);
            redirect("/admin/empresa");
            }
            

    Como vemos, es una simple función que recibe como parámetro el identificador de ese registro; es algo tosco este comportamiento, ya que al aplicar la acción para actualizar algo tan sencillo como un estatus debe culminar en la carga completa de la aplicación; sería interesante que la acción se le pueda atar a un campo de la tabla y la actualización se procese mediante AJAX; pero no ofrece tal opción.

  • Este parámetro es un icono representativo de la API de jQuery UI.

Evitar que Grocery CRUD cargue el jQuery en nuestro proyecto

Si en el sitio que estás empleando usas jQuery, para evitar cargarlo nuevamente podemos emplear la siguiente línea de código:

 $crud->unset_jquery();

Crear relaciones con otras tablas

Si deseamos emplear alguna relación con otras tablas la cosa se nos puede complicar un poco; para ello hay que emplear el set_relation:

$crud->set_relation('cliente_id', 'clientes', 'nombre_comercial');

La lógica es bastante sencilla, primero colocamos el campo en común que tiene la tabla establecida en nuestro Grocery CRUD con la que queremos vincular, en este caso cliente_id, luego el nombre de la tabla y seguido el campos que deseamos mostrar; con esto logramos mostrar el campo 'nombre_comercial' en la tabla de jQuery Datatable y un campo de selección desplegable en los formularios de creación y edición:

$crud->set_table('proyectos');
$crud->fields('cliente_id', 'nombre', 'cantidad', 'fecha_alta', 'inicio_produccion', 'fecha_entrega', 'descripcion', 'precio', 'estado_id', 'user_id', 'estado_activo');
 
$crud->set_relation('cliente_id', 'clientes', '{nombre_comercial}- {cliente} {apellido}', array(
    'clientes.email IS NOT NULL' => NULL,
    'clientes.usuario' => 1,
    'clientes.user_id != ' => $this->session->userdata('id')));

En el ejemplo anterior vemos que podemos emplear un esquema más complejo de set_relation el cual nos permite mediante un array aplicar condiciones sobre la tabla clientes como si de un where se tratase; además, personalizamos el formato del campo a mostrar '{nombre_comercial}- {cliente} {apellido}' para mostrar múltiples campos de una sola vez.

Lamentablemente no podemos hacer múltiples vinculaciones con mista tabla, por ejemplo si quisiéramos mostrar los campos de nombre_comercial y nombre en columnas diferentes no hay manera.

Validando los formularios

Para aplicar validaciones en los formularios se emplea el método set_rules:

$crud->set_rules('nombre', 'nombre', 'trim|max_length[100]|required');
            $crud->set_rules('descripcion', 'descripcion', 'trim');

Cómo ves, las reglas aplicadas siguen la misma lógica que las validaciones de formularios en CodeIgniter y se separan con pipes.

Renderizar todo lo anterior (controlador)

Una vez configurada la tabla; empleamos el método:

$output = $crud->render();

Renderizar todo lo anterior (vista)

Finalmente, para mostrar la tabla en alguna vista seleccionada debemos emplear el siguiente código:

<?php foreach ($css_files as $file): ?>
    <link type="text/css" rel="stylesheet" href="<?php echo $file; ?>" />
<?php endforeach; ?>
<?php foreach ($js_files as $file): ?>
    <script src="<?php echo $file; ?>"></script>
<?php endforeach; ?>
<?php echo $output; ?>

Si lo analizamos, el código anterior no hace más que pintar los CSS y JavaScript necesarios para renderizar la tabla e imprimir la tabla misma.

Instalación de la librería

Los pasos para instalar la librería los puedes consultar desde el site oficial en: aunque todo se reduce a los siguientes pasos:

  • Copiar el archivo de configuración grocery_crud en la carpeta conf.
  • Copiar el modelo Grocery_crud_model en la carpeta models.
  • Copiar el archivo Grocery_CRUD en la carpeta libraries.
  • Copiar la carpeta assets en la raíz.

Tema personalizado para la jQuery datatable

Verás que la tabla o el diseño por defecto aunque no es "horroroso" si está anticuado y rompe un poco con el esquema de sitios actuales los cuales todos tienen algo en común, que es ser minimalista; para esto la misma gente de grocery CRUD provee un tema (eso sí de pago) el cual puede consultar en el siguiente link junto con toda la información necesaria como forma de pago (PayPal), instalación (reemplazar algunos archivos y agregar otros) y poco más; como verás, es Bootstrap, lo cual puedes personalizarlo según la paleta de colores que tengas creada para tu aplicación.

Compre el tema promocionado (aunque no acostumbro a comprar absolutamente ningún recurso -es el primer recurso que compro-) y no he tenido ningún inconveniente mayor instalando, configurando y usando el mismo; lo que ves es lo que obtienes.

Para emplear un tema en particular (por ejemplo el anterior) se usa el método:

$crud->set_theme('bootstrap');

Publicidad

Give me for a beer!

Algunos recursos que te pueden interesar

API REST en CodeIgniter

API REST en CodeIgniter

Algunos artículos que te pueden interesar

Cómo instalar la SDK de Facebook para PHP en CodeIgniter

Cómo instalar la SDK de Facebook para PHP en CodeIgniter

Andrés Cruz 08-09-2016

Quitar el index.php de la URL en CodeIgniter

Quitar el index.php de la URL en CodeIgniter

Explicamos cómo remover el index.php de las urls de CodeIgniter.

Andrés Cruz 05-06-2013

Instalación de CodeIgniter

Instalación de CodeIgniter

Daremos una explicación detallada de como instalar CodeIgniter en nuestro servidor.

Andrés Cruz 25-05-2013