LinuxParty

NUESTRO SITIO necesita la publicidad para costear hosting y el dominio. Por favor considera deshabilitar tu AdBlock en nuestro sitio. También puedes hacernos una donación entrando en linuxparty.es, en la columna de la derecha.
Inicio desactivadoInicio desactivadoInicio desactivadoInicio desactivadoInicio desactivado
 

11- Añadir verificaciones

Verificación de los formularios (lado del cliente)

Los formularios se pueden verificar en el lado del cliente mediante código javascript.
En el archivo admin/views/helloworld/tmpl/edit.php ingrese las siguientes líneas:


 

<?php
// No permitir el acceso directo al archivo
defined('_JEXEC') or die('Restricted access');
JHtml::_('behavior.tooltip');
JHtml::_('behavior.formvalidation');
?>
<form action="<?php echo JRoute::_('index.php?option=com_helloworld&layout=edit&id='.(int) $this->item->id); ?>"
method="post" name="adminForm" id="helloworld-form" class="form-validate">
<fieldset class="adminform">
<legend><?php echo JText::_( 'COM_HELLOWORLD_HELLOWORLD_DETAILS' ); ?></legend>
<?php foreach($this->form->getFieldset() as $field): ?>
<?php if (!$field->hidden): ?>
<?php echo $field->label; ?>
<?php endif; ?>
<?php echo $field->input; ?>
<?php endforeach; ?>
</fieldset>
<div>
<input type="hidden" name="task" value="helloworld.edit" />
<?php echo JHtml::_('form.token'); ?>
</div>
</form>

 Se puede notar en el formulario html, contenido en el archivo admin/views/helloworld/tmpl/edit.php, que ahora posee la clase form-validate. Tambien podras ver que hemos añadido la llamada JHTML::_('behavior.formvalidation'); para decirle a Joomla! que utilice su formulario de validación javascript.

Modificamos el archivo admin/models/forms/helloworld.xml para indicar que el campo greeting se tiene que verificar:

<?xml version="1.0" encoding="utf-8"?>
<form
addrulepath="/administrator/components/com_helloworld/models/rules"
>
<fieldset>
<field
name="id"
type="hidden"
/>
<field
name="greeting"
type="text"
label="COM_HELLOWORLD_HELLOWORLD_GREETING_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_GREETING_DESC"
size="40"
class="inputbox validate-greeting"
validate="greeting"
required="true"
default=""
/>
</fieldset>
</form>

Note que por el momento la clase css es “inputbox validate-greeting” y que el atributo required está puesto a true. Esto significa que este campo es obligatorio y debe ser verificado por un validador de formulario del Framework de Joomla!.

Con tu gestor de archivo y editor favorito cree el archivo admin/models/forms/helloworld.js que contenga:


 window.addEvent('domready', function() {

        document.formvalidator.setHandler('greeting',
               function (value) {
                       regex=/^[^0-9]+$/;
                       return regex.test(value);
       });
});

 Se añade un controlador al formulario de validación de Joomla! para los campos que tienen la clase “validate-greeting”.  Cada vez que se modifica el campo greeting  el controlador se ejecutará para comprobar su validez (sin cifras). El último paso es verificar el formulario cuando se hace clic en el botón guardar.

Con tu gestor de archivo y editor favorito cree el archivo admin/views/helloworld/submitbutton.js que contenga:


 

Joomla.submitbutton = function(task)
{
       if (task == '')
       {
               return false;
       }
       else
       {
               var isValid=true;
               var action = task.split('.');
               if (action[1] != 'cancel' && action[1] != 'close')
               {
                       var forms = $$('form.form-validate');
                       for (var i=0;i<forms.length;i++)
                       {
                               if (!document.formvalidator.isValid(forms[i]))
                               {
                                       isValid = false;
                                       break;
                               }
                       }
               }

               if (isValid)
               {
                       Joomla.submitform(task);
                       return true;
               }
               else
               {
                       alert(Joomla.JText._('COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE',
                                            'Some values are unacceptable'));
                       return false;
               }
       }
}

Esta función verifica que todos los formularios que tienen la clase css “form-validate” sean validados.

Tenga en cuenta que se mostrará un mensaje de alerta, traducido por el Framework de Joomla!.

En la vista la clase HelloWorldViewHelloWorld tiene que ser modificada para usar estos archivos javascript: admin/views/helloworld/view.html.php 


 

<?php
// No permitir el acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// Importar la biblioteca view de Joomla
jimport('joomla.application.component.view');

/**
* Vista HelloWorld
*/
class HelloWorldViewHelloWorld extends JView
{
/**
* Mostrar el metodo de la vista Hello
* @return void
*/
public function display($tpl = null)
{
// Obtener los datos
$form = $this->get('Form');
$item = $this->get('Item');
$script = $this->get('Script');

// Verificar existencia de errores.
if (count($errors = $this->get('Errors')))
{
JError::raiseError(500, implode('<br />', $errors));
return false;
}
// Asiganar datos
$this->form = $form;
$this->item = $item;
$this->script = $script;

// Establezca el Toolbar
$this->addToolBar();

// Mostrar la plantilla
parent::display($tpl);

// Establesca el Document
$this->setDocument();
}

/**
* Configuración del Toolbar
*/
protected function addToolBar()
{
$input = JFactory::getApplication()->input;
$input->set('hidemainmenu', true);
$isNew = ($this->item->id == 0);
JToolBarHelper::title($isNew ? JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW') : JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT'), 'helloworld');
JToolBarHelper::save('helloworld.save');
JToolBarHelper::cancel('helloworld.cancel', $isNew ? 'JTOOLBAR_CANCEL' : 'JTOOLBAR_CLOSE');
}
/**
* Método para configurar las propiedades del documento
*
* @return void
*/
protected function setDocument()
{
$isNew = ($this->item->id < 1);
$document = JFactory::getDocument();
$document->setTitle($isNew ? JText::_('COM_HELLOWORLD_HELLOWORLD_CREATING') : JText::_('COM_HELLOWORLD_HELLOWORLD_EDITING'));
$document->addScript(JURI::root() . $this->script);
$document->addScript(JURI::root() . "/administrator/components/com_helloworld" . "/views/helloworld/submitbutton.js");
JText::script('COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE');
}
}
 

 Esta vista ahora:

  • Verifica si el modelo no tiene error
  • Agrega dos archivos Javascript
  • Inyecta traducciones usando la función javascript JText::script

El paso final es implementar una función getScript en el modelo HelloWorldModelHelloWorld.

Modificando el archivo admin/models/helloworld.php tenemos:


 

<?php
// No permitir el acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// Importar la biblioteca modelform
jimport('joomla.application.component.modeladmin');

/**
* Modelo HelloWorld
*/
class HelloWorldModelHelloWorld extends JModelAdmin
{
/**
* Retornar una referencia a la tabla object, siempre que se cree.
*
* @paramtype El tipo de tabla para crear una instancia
* @paramstring Un prefijo para el nombre de la clase de la tabla. Opcional.
* @paramarray Configuración del array para el modelo. Opcional.
* @return JTable Un objeto de Base de Datos.
* @since 2.5
*/
public function getTable($type = 'HelloWorld', $prefix = 'HelloWorldTable', $config = array())
{
return JTable::getInstance($type, $prefix, $config);
}
/**
* Método para obtener el formulario de registro.
*
* @paramarray $data Datos para el formulario.
* @paramboolean $loadData True si el formulario carga sus propios datos (caso por defecto), false si no.
* @return mixed Un objeto JForm en caso de éxito, FALSE en caso de fallo
* @since 2.5
*/
public function getForm($data = array(), $loadData = true)
{
// Obtener el formulario
$form = $this->loadForm('com_helloworld.helloworld', 'helloworld',
array('control' => 'jform', 'load_data' => $loadData));
if (empty($form))
{
return false;
}
return $form;
}
/**
* Método para obtener los script que se deben incluir en el formulario
*
* @return string Archivos Script
*/
public function getScript()
{
return 'administrator/components/com_helloworld/models/forms/helloworld.js';
}
/**
* Método para obtener los datos que deben ser inyectados en el formulario.
*
* @return mixed Los datos para el formulario.
* @since 2.5
*/
protected function loadFormData()
{
// Compruebe la sesión de datos del formulario previamente introducidos.
$data = JFactory::getApplication()->getUserState('com_helloworld.edit.helloworld.data', array());
if (empty($data))
{
$data = $this->getItem();
}
return $data;
}
}

 

Verificación de los formularios (lado del servidor)

Las verificaciones de los formularios en el lado del servidor se realiza mediante la herencia de la clase JControllerForm. Hemos especificado en el archivo admin/models/forms/helloworld.xml que la función de validación del servidor usará el archivo greeting.php.

Con tu gestor de archivos y editor favorito crea el archivo admin/models/rules/greeting.php que contenga:


 

<?php
// No permitir el acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// Importar la biblioteca formrule de Joomla
jimport('joomla.form.formrule');

/**
* Reglas de la clase formulario para el Framework de Joomla.
*/
class JFormRuleGreeting extends JFormRule
{
/**
* Una expresión regular.
*
* @access protected
* @varstring
* @since 2.5
*/
protected $regex = '^[^0-9]+$';
}

 


Empaqueta tu componente e instalalo mediante el gestor de extensiones de Joomla! o descarga el archivo directamente.

12- Añadir categorías

El Framework de Joomla! ha implementado el uso de categorías para todos los componentes. Añadir esta habilidad es bastante simple.

Modificar el SQL

Para gestionar las categorías, tenemos que cambiar las tablas SQL.
Con tu editor favorito, modifica el archivo admin/sql/install.mysql.utf8.sql y añade estas líneas:


 

DROP TABLE IF EXISTS `#__helloworld`;

CREATE TABLE `#__helloworld` (
`id` INT(11) NOT NULL AUTO_INCREMENT,
`greeting` VARCHAR(25) NOT NULL,
`catid` INT(11) NOT NULL DEFAULT '0',
PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=0 DEFAULT CHARSET=utf8;

INSERT INTO `#__helloworld` (`greeting`) VALUES
('Hello World!'),
('Good bye World!');

Recuerden que esto trae consigo que modifiquemos el siguiente fichero admin/sql/updates/mysql/0.0.12.sql:

ALTER TABLE `#__helloworld` ADD `catid` INT(11) NOT NULL DEFAULT '0'

Modificar el formulario

El mensaje HelloWorld puede pertenecer ahora a una categoría. Tenemos que modificar el formulario de edición. Añade estas líneas al archivo admin/models/forms/helloworld.xml:


 

<?xml version="1.0" encoding="utf-8"?>
<form
addrulepath="/administrator/components/com_helloworld/models/rules"
>
<fieldset>
<field
name="id"
type="hidden"
/>
<field
name="greeting"
type="text"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC"
size="40"
class="inputbox validate-greeting"
validate="greeting"
required="true"
default=""
/>
<field
name="catid"
type="category"
extension="com_helloworld"
class="inputbox"
default=""
label="COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_DESC"
required="true"
>
<option value="0">JOPTION_SELECT_CATEGORY</option>
</field>
</fieldset>
</form>

 Nota: La categoría puede ser 0 (lo que indica que no hay categoría)

Modificar el tipo de menú

El tipo de menú HelloWorld muestra una lista desplegable con todos los mensajes. Si el mensaje está categorizado, tenemos que añadir la categoría en la presentación.

En el archivo admin/models/fields/helloworld.php, añade las siguientes líneas:


 

<?php
// No permitir acceso directo al archivo
defined('_JEXEC') or die;

// importar el tipo de campo list
jimport('joomla.form.helper');
JFormHelper::loadFieldClass('list');

/**
* Clase de campo de formulario para el componente HelloWorld
*/
class JFormFieldHelloWorld extends JFormFieldList
{
/**
* El tipo de campo.
*
* @varstring
*/
protected $type = 'HelloWorld';

/**
* Método para obtener una lista de opciones para entrada de lista.
*
* @return array Array de opciones JHmtl.
*/
protected function getOptions()
{
$db = JFactory::getDBO();

/// $query = new JDatabaseQuery; ATENCIÓN - Hay un error en esta línea, JDatabaseQuery es una clase abstracta
$query = $db->getQuery(true); // ESTE ES EL ARREGLO, OJO DEBE SER MODIFICADO EN ARCHIVO COMPRIMIDO (SI ES QUE LO DESCARGA Y LO USA)
$query->select('#__helloworld.id as id,greeting,#__categories.title as category,catid');
$query->from('#__helloworld');
$query->leftJoin('#__categories on catid=#__categories.id');
$db->setQuery((string)$query);
$messages = $db->loadObjectList();
$options = array();
if ($messages)
{
foreach($messages as $message)
{
$options[] = JHtml::_('select.option', $message->id, $message->greeting .
($message->catid ? ' (' . $message->category . ')' : ''));
}
}
$options = array_merge(parent::getOptions(), $options);
return $options;
}
}

Ahora mostrará la categoría entre paréntesis.

Gestionar el submenú

El componente com_categories permite configurar el submenú utilizando el archivo helper. Con tu gestor y editor de archivos preferido, crea un archivo admin/helpers/helloworld.php que contenga estas líneas:


 

<?php
// No permitir acceso directo al archivo
defined('_JEXEC') or die;

/**
* Ayuda del componente HelloWorld.
*/
abstract class HelloWorldHelper
{
/**
* Configurar la barra de enlaces.
*/
public static function addSubmenu($submenu)
{
JSubMenuHelper::addEntry(JText::_('COM_HELLOWORLD_SUBMENU_MESSAGES'),
'index.php?option=com_helloworld', $submenu == 'messages');
JSubMenuHelper::addEntry(JText::_('COM_HELLOWORLD_SUBMENU_CATEGORIES'), 'index.php?option=com_categories&view=categories&extension=com_helloworld', $submenu == 'categories');
// configurar algunas propiedades globales
$document = JFactory::getDocument();
$document->addStyleDeclaration('.icon-48-helloworld ' . '{background-image: url(/../media/com_helloworld/images/tux-48x48.png);}');
if ($submenu == 'categories')
{
$document->setTitle(JText::_('COM_HELLOWORLD_ADMINISTRATION_CATEGORIES'));
}
}
}
 

 Esta función será llamada automáticamente por el componente com_categories. Sepa que:

  • Cambiará el submenú
  • Cambiará algunas propiedades css (para mostrar iconos)
  • Cambiará el título del navegador si el submenú es categories
  • Cambiará el título y añadirá un botón preferences

Tenemos que modificar el controlador general para llamar a esta función y modificar el punto de entrada del componente (la clase css .icon-48-helloworld se configura ahora en la función addSubmenu)

admin/controller.php 


 

<?php
// No permitir acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// Importar librería controller de Joomla
jimport('joomla.application.component.controller');

/**
* Controlador General del componente HelloWorld
*/
class HelloWorldController extends JController
{
/**
* mostrar tarea
*
* @return void
*/
function display($cachable = false)
{
// configurar vista por defecto si no está configurada
$input = JFactory::getApplication()->input;
$input->set('view', $input->getCmd('view', 'HelloWorlds'));

// llamar comportamiento padre
parent::display($cachable);

// Configurar el submenú
HelloWorldHelper::addSubmenu('messages');
}
}


 admin/helloworld.php


 

<?php
// No permitir acceso directo al archivo
defined('_JEXEC') or die('Restricted access');

// requerir archivo de ayuda
JLoader::register('HelloWorldHelper', dirname(__FILE__) . DS . 'helpers' . DS . 'helloworld.php');

// importar librería de controladores de Joomla
jimport('joomla.application.component.controller');

// Obtener una instancia del controlador prefijado por HelloWorld
$controller = JController::getInstance('HelloWorld');

// Realizar la tarea de solicitud
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirigir si está configurado por el controlador
$controller->redirect(); 

 

Añadir algunas cadenas de traducción

Algunas cadenas tienen que ser traducidas. En el archivo admin/language/es-ES/es-ES.com_helloworld.ini, añade las siguientes líneas:

COM_HELLOWORLD="Hello World!"
COM_HELLOWORLD_ADMINISTRATION="HelloWorld - Administración"
COM_HELLOWORLD_ADMINISTRATION_CATEGORIES="HelloWorld - Categorías"
COM_HELLOWORLD_HELLOWORLD_CREATING="HelloWorld - Crear"
COM_HELLOWORLD_HELLOWORLD_DETAILS="Detalles"
COM_HELLOWORLD_HELLOWORLD_EDITING="HelloWorld - Editar"
COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE="Algunos valores no se pueden aceptar"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_DESC="Categoría a la que pertenecen los mensajes"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_LABEL="Categoría"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC="Se mostrará este mensaje"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL="Mensaje"
COM_HELLOWORLD_HELLOWORLD_HEADING_GREETING="Bienvenida"
COM_HELLOWORLD_HELLOWORLD_HEADING_ID="Id"
COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT="Gestor de HelloWorld: Editar Mensaje"
COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW="Gestor de HelloWorld: Nuevo Mensaje"
COM_HELLOWORLD_MANAGER_HELLOWORLDS="Gestor de HelloWorld"
COM_HELLOWORLD_N_ITEMS_DELETED_1="Un mensaje eliminado"
COM_HELLOWORLD_N_ITEMS_DELETED_MORE="%d mensajes eliminados"
COM_HELLOWORLD_SUBMENU_MESSAGES="Mensajes"
COM_HELLOWORLD_SUBMENU_CATEGORIES="Categorías"

Nuestro archivo helloworld.xml queda de la siguiente forma:


 

<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="2.5.0" method="upgrade">

<name>COM_HELLOWORLD</name>
<creationDate>Octubre 2012</creationDate>
<author>Carlos R & Andoitz B</author>
<authorEmail>email</authorEmail>
<authorUrl>http://www.ejemplo.org</authorUrl>
<copyright>Copyright Info</copyright>
<license>Licencia Info</license>
<version>0.0.12</version>
<description>COM_HELLOWORLD_DESCRIPTION</description>

<install>
<sql>
<file driver="mysql" charset="utf8">sql/install.mysql.utf8.sql</file>
</sql>
</install>
<uninstall>
<sql>
<file driver="mysql" charset="utf8">sql/uninstall.mysql.utf8.sql</file>
</sql>
</uninstall>
<update>
<schemas>
<schemapath type="mysql">sql/updates/mysql</schemapath>
</schemas>
</update>

<files folder="site">
<filename>index.html</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<folder>views</folder>
<folder>models</folder>
<folder>language</folder>
</files>

<media destination="com_helloworld" folder="media">
<filename>index.html</filename>
<folder>images</folder>
</media>

<administration>

<menu img="../media/com_helloworld/images/tux-16x16.png">COM_HELLOWORLD_MENU</menu>

<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<folder>sql</folder>
<folder>tables</folder>
<folder>models</folder>
<folder>views</folder>
<folder>controllers</folder>

<!-- Sección de archivos helpers -->
<folder>helpers</folder>
</files>

<languages folder="admin">
<language tag="es-ES">language/es-ES/es-ES.com_helloworld.ini</language>
<language tag="es-ES">language/es-ES/es-ES.com_helloworld.sys.ini</language>
</languages>
</administration>

</extension>

Ya sabes que hacer para comprobar esto. Recuerda también que puedes descargar el archivo directamente, pero ten presente antes de instalarlo, modificar la línea en el archivo admin/models/fields/helloworld.php

Desarrollo de componentes en Joomla 2.5 (5 de 8) | Desarrollo de componentes en Joomla 2.5 (7 de 8)

 

Pin It

Escribir un comentario


Código de seguridad
Refescar



Redes:



 

Suscribete / Newsletter

Suscribete a nuestras Newsletter y periódicamente recibirás un resumen de las noticias publicadas.

Donar a LinuxParty

Probablemente te niegues, pero.. ¿Podrías ayudarnos con una donación?


Tutorial de Linux

Filtro por Categorías