LinuxParty
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)
-
Programación
- Thomas E. Kurtz, coinventor de BASIC, muere a los 96 años
- Profesor de informática del MIT prueba el impacto de la IA en la formación de programadores
- Lanzamiento del IDE de código abierto Qt Creator 14 con soporte para complementos basados en Lua
- Plantillas para Joomla - Episodio 1: Plantillas, marcos y clubes o no...
- Este es el mejor libro que he visto para aprender a programar en Python en castellano desde cero, gratis y online
- ¿Deberían los niños seguir aprendiendo a programar en la era de la IA?
- La 'obsolescencia' de VBScript confirmada por Microsoft y su eventual eliminación de Windows
- El Gran Debate: ¿Deberían los Modelos de Inteligencia Artificial Ser de Código Abierto?
- El lenguaje de programación BASIC cumple 60 años
- El CEO de Nvidia dice que los niños no deberían aprender a programar
- 40 años de Turbo Pascal: recuerdos del dinosaurio codificador que revolucionó los IDE
- Los lenguajes de programación más populares y dónde aprenderlos.
- Top 5 de los principales lenguajes de programación para desarrollar aplicaciones de escritorio Linux
- Qt Creator 12 lanzado con complementos de grabación de pantalla y Explorador de compiladores
- 10 sitios web para practicar problemas de programación