martes, 7 de marzo de 2017

Codeigniter - Grocery CRUD

Posted by daycry at 14:10 Labels: , , , , 
$crud = new grocery_CRUD();

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


jQuery datatable como elemento central

Como veras si algunas vez has empleado las estupendas tablas de jQuery datatable son las empleadas por grocery CRUD son las mismas; en general, lo "malo" de usar estas tablas, es que requieren bastante configuración al tomarlas como "núcleo" para crear nuestro CRUD (por sus siglas en inglés de: Create, Read, Update and Delete) que tendríamos que hacer a mano; configuraciones 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.


Trabajando con grocery CRUD

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

Instanciando la tabla


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 o vista 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')

Cláusulas Where para filtrar datos

Además, 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: 
$crud->unset_read();
O actualizar los registros 
$crud->unset_edit();

Creando nuestras propias operaciones

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 actividad 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 por el momento no ofrece tal opción.
Este parámetro es un icono representativo de la API de jQuery UI.

Carga de jQuery

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();
Si deseamos emplear alguna relación con otras tablas la cosa se complica; en teoría hay que emplear los siguientes métodos según el tipo de relación:
  • set_relation
  • set_relation_n_n
Sin embargo no tuve suerte con estos y preferí emplear una vista en base de datos que realizará el trabajo y definir la PK en la vista con: 
$crud->set_table('v_empresa_pagos');
$crud->set_primary_key('id');

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.

Para emplear un tema en particular (por ejemplo el anterior) se usa el método:
$crud->set_theme('bootstrap');

No hay comentarios :

Publicar un comentario

Suscribirse a: Enviar comentarios ( Atom )