Desarrollo de un Componente MVC/Lado servidor básico
From Joomla! Documentation
< J3.x:Developing an MVC Component
Artículos de esta Serie
- Introducción
- Desarrollo de un Componente Básico
- Agregar una vista a la parte del sitio
- Agregar un tipo de menú a la parte del sitio
- Agregar un modelo a la parte del sitio
- Agregar una variable de petición en el tipo de menú
- Utilizando la base de datos
- Lado servidor básico
- Agregar gestión de idioma
- Agregar acciones del lado servidor
- Agregar decoraciones del lado servidor
- Agregar verificaciones
- Agregar categorías
- Agregar configuración
- Agregar ACL
- Agregar un archivo de secuencia de comandos instalar-desinstalar-actualizar
- Agregar un formulario del lado cliente
- Agregar una imagen
- Agregar un mapa
- Agregar AJAX
- Agregar un alias
- Usar la facilidad filtro de idioma
- Agregar una Modal
- Agregar Asociaciones
- Agregar Comprobación
- Agregar Ordenamiento
- Agregar Niveles
- Agregar Control de Versiones
- Agregar Etiquetas
- Agregar Accesos
- Agregar procesos por lote
- Agregar Caché
- Agregar un Canal de Noticias
- Agregar un servidor de actualización
- Agregar campos personalizados
Esta es una serie multi-artículos de tutoriales sobre cómo desarrollar un Componente Modelo-Vista-Controlador para Joomla! Versión.
Comenzar con la Introducción, y navegar por los artículos de esta serie usando el botón de navegación en la parte inferior o en el cuadro de la derecha (los "Artículos de esta serie").
Introducción
Este artículo es parte del tutorial Desarrollo de un Componente MVC para Joomla! 3.2. Te invitamos a leer las partes anteriores del tutorial antes de leer esto.
Hay 2 videos (en inglés) asociados con este paso del tutorial, que cubren Estructura y paginación MVC y elementos HTML y código Javascript.
Lado servidor básico
El diseño de la interfaz del lado servidor nos lleva a crear al menos un tríptico Modelo-Vista-Controlador. Tenemos que modificar el punto de entrada del administrador de de nuestro componente, el archivo admin/helloworld.php.
admin/helloworld.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');
// Perform the Request task
$controller->execute(JFactory::getApplication()->input->get('task'));
// Redirect if set by the controller
$controller->redirect();
Crear el contralor general
El punto de entrada ahora recibe una instancia de un controlador HelloWorld prefijado. Vamos a crear un controlador básico para la parte del administrador:
admin/controller.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
/**
* General Controller of HelloWorld component
*
* @package Joomla.Administrator
* @subpackage com_helloworld
* @since 0.0.7
*/
class HelloWorldController extends JControllerLegacy
{
/**
* The default view for the display method.
*
* @var string
* @since 12.2
*/
protected $default_view = 'helloworlds';
}
Este controlador mostrará la vista 'HelloWorlds' de forma predeterminada.
Crear la vista
Con tu administrador y editor de archivos favoritos, crea un archivo de admin/views/helloworlds/view.html.php que contenga:
admin/views/helloworlds/view.html.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
/**
* HelloWorlds View
*
* @since 0.0.1
*/
class HelloWorldViewHelloWorlds extends JViewLegacy
{
/**
* Display the Hello World view
*
* @param string $tpl The name of the template file to parse; automatically searches through the template paths.
*
* @return void
*/
function display($tpl = null)
{
// Get data from the model
$this->items = $this->get('Items');
$this->pagination = $this->get('Pagination');
// Check for errors.
if (count($errors = $this->get('Errors')))
{
JError::raiseError(500, implode('<br />', $errors));
return false;
}
// Display the template
parent::display($tpl);
}
}
En Joomla, las vistas muestran los datos en la pantalla usando el diseño. Con tu administrador y editor de archivos favoritos, coloca un archivo admin/views/helloworlds/tmpl/default.php que contenga
admin/views/helloworlds/tmpl/default.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted Access');
?>
<form action="index.php?option=com_helloworld&view=helloworlds" method="post" id="adminForm" name="adminForm">
<table class="table table-striped table-hover">
<thead>
<tr>
<th width="1%"><?php echo JText::_('COM_HELLOWORLD_NUM'); ?></th>
<th width="2%">
<?php echo JHtml::_('grid.checkall'); ?>
</th>
<th width="90%">
<?php echo JText::_('COM_HELLOWORLD_HELLOWORLDS_NAME') ;?>
</th>
<th width="5%">
<?php echo JText::_('COM_HELLOWORLD_PUBLISHED'); ?>
</th>
<th width="2%">
<?php echo JText::_('COM_HELLOWORLD_ID'); ?>
</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="5">
<?php echo $this->pagination->getListFooter(); ?>
</td>
</tr>
</tfoot>
<tbody>
<?php if (!empty($this->items)) : ?>
<?php foreach ($this->items as $i => $row) : ?>
<tr>
<td>
<?php echo $this->pagination->getRowOffset($i); ?>
</td>
<td>
<?php echo JHtml::_('grid.id', $i, $row->id); ?>
</td>
<td>
<?php echo $row->greeting; ?>
</td>
<td align="center">
<?php echo JHtml::_('jgrid.published', $row->published, $i, 'helloworlds.', true, 'cb'); ?>
</td>
<td align="center">
<?php echo $row->id; ?>
</td>
</tr>
<?php endforeach; ?>
<?php endif; ?>
</tbody>
</table>
</form>
COM_HELLOWORLD_HELLOWORLDS_NAME, COM_HELLOWORLD_ID y los otros son los marcadores de posición que más tarde serán reemplazados con un texto del idioma específico. JText::_ método de traducir una cadena en el idioma actual.
checkAll es una función javascript definida en el núcleo de Joomla capaz de controlar todos los elementos.
JHtml::_ es una función auxiliar capaz de mostrar varias salidas HTML. En este caso, se mostrará una casilla de verificación para el elemento.
JPagination es una clase de Joomla capaz de gestionar y mostrar el objeto pagination.
Crear el modelo
La vista HelloWorlds consulta al modelo por los datos. En Joomla, hay una clase capaz de gestionar una lista de datos: JModelList. la clase JModelList y sus clases heredadas sólo necesitan de un método:
- getListQuery que construye una consulta SQL
y dos estados:
- list.start para la determinar la salida de la lista
- list.limit para la determinar la longitud de la lista
Los métodos getItems y getPagination se definen en la clase JModelList. Ellos no necesitan ser definidos en la clase HelloWorldModelHelloWorlds.
admin/models/helloworlds.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
/**
* HelloWorldList Model
*
* @since 0.0.1
*/
class HelloWorldModelHelloWorlds extends JModelList
{
/**
* Method to build an SQL query to load the list data.
*
* @return string An SQL query
*/
protected function getListQuery()
{
// Initialize variables.
$db = JFactory::getDbo();
$query = $db->getQuery(true);
// Create the base select statement.
$query->select('*')
->from($db->quoteName('#__helloworld'));
return $query;
}
}
El método _populateState es, de forma predeterminada, llamado automáticamente cuando un estado es leído por el método getState.
Empaquetado del componente
El contenido de tu directorio de código
- helloworld.xml
- site/helloworld.php
- site/index.html
- site/controller.php
- site/views/index.html
- site/views/helloworld/index.html
- site/views/helloworld/view.html.php
- site/views/helloworld/tmpl/index.html
- site/views/helloworld/tmpl/default.xml
- site/views/helloworld/tmpl/default.php
- site/models/index.html
- site/models/helloworld.php
- admin/index.html
- admin/helloworld.php
- admin/controller.php
- admin/sql/index.html
- admin/sql/install.mysql.utf8.sql
- admin/sql/uninstall.mysql.utf8.sql
- admin/sql/updates/index.html
- admin/sql/updates/mysql/index.html
- admin/sql/updates/mysql/0.0.1.sql
- admin/sql/updates/mysql/0.0.6.sql
- admin/models/index.html
- admin/models/fields/index.html
- admin/models/fields/helloworld.php
- admin/models/helloworlds.php
- admin/views/index.html
- admin/views/helloworlds/index.html
- admin/views/helloworlds/view.html.php
- admin/views/helloworlds/tmpl/index.html
- admin/views/helloworlds/tmpl/default.php
- admin/tables/index.html
- admin/tables/helloworld.php
Crea un archivo comprimido de este directorio o descarga directamente el archivo e instálalo con el gestor de extensiones de Joomla. Puedes agregar un elemento de menú de este componente usando el gestor de menús en el lado del servidor.
helloworld.xml
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.0" method="upgrade">
<name>Hello World!</name>
<!-- The following elements are optional and free of formatting constraints -->
<creationDate>January 2018</creationDate>
<author>John Doe</author>
<authorEmail>john.doe@example.org</authorEmail>
<authorUrl>http://www.example.org</authorUrl>
<copyright>Copyright Info</copyright>
<license>License Info</license>
<!-- The version string is recorded in the components table -->
<version>0.0.7</version>
<!-- The description is optional and defaults to the name -->
<description>Description of the Hello World component ...</description>
<install> <!-- Runs on install -->
<sql>
<file driver="mysql" charset="utf8">sql/install.mysql.utf8.sql</file>
</sql>
</install>
<uninstall> <!-- Runs on uninstall -->
<sql>
<file driver="mysql" charset="utf8">sql/uninstall.mysql.utf8.sql</file>
</sql>
</uninstall>
<update> <!-- Runs on update; New since J2.5 -->
<schemas>
<schemapath type="mysql">sql/updates/mysql</schemapath>
</schemas>
</update>
<!-- Site Main File Copy Section -->
<!-- Note the folder attribute: This attribute describes the folder
to copy FROM in the package to install therefore files copied
in this section are copied from /site/ in the package -->
<files folder="site">
<filename>index.html</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<folder>views</folder>
<folder>models</folder>
</files>
<administration>
<!-- Administration Menu Section -->
<menu link='index.php?option=com_helloworld'>Hello World!</menu>
<!-- Administration Main File Copy Section -->
<!-- Note the folder attribute: This attribute describes the folder
to copy FROM in the package to install therefore files copied
in this section are copied from /admin/ in the package -->
<files folder="admin">
<!-- Admin Main File Copy Section -->
<filename>index.html</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<!-- SQL files section -->
<folder>sql</folder>
<!-- tables files section -->
<folder>tables</folder>
<!-- models files section -->
<folder>models</folder>
<!-- views files section -->
<folder>views</folder>
</files>
</administration>
</extension>
Ahora puedes ver en tu componente hello-world un array con dos columnas, dos filas y casillas de verificación. Puede hacer clic en las casillas de verificación para seleccionar las diferentes opciones que desees.
Por favor, crea una petición o tema en https://github.com/joomla/Joomla-3.2-Hello-World-Component para cualquier discrepancia en el código o para la edición de cualquier parte del código fuente de esta página.