Joomla! Documentation - User contributions [en]

J3.x:Developing an MVC Component/Adding configuration

2020-02-20T13:22:24Z

Es ka: fix typo and highlighting in admin/views/helloworld/tmpl/edit.php

<noinclude><languages /></noinclude>
{{:J3.1:Developing an MVC Component/<translate>
en</translate>}}
<translate>== Introduction == </translate>
<translate>
This tutorial is part of the [[S:MyLanguage/J3.2:Developing an MVC Component | Developing an MVC Component for Joomla! 3.2]] tutorial. You are encouraged to read the previous parts of the tutorial before reading this.</translate>

<translate>

In this step we provide the ability for administrator to control the display of the category on the front end. We'll do this by specifying a global configuration parameter which can be set to Show or Hide, but also allow the administrator to override this setting on an individual Helloworld message basis. To enable this, we'll introduce a params field in the database record, which will be a string in JSON format (as is common in many Joomla core components), and we'll need to change the accompanying code to handle this.</translate>

<translate> You can watch a video associated with this step at [https://youtu.be/NCdjbzMrkgk Step 13, Adding Configuration].</translate>

{{#widget:YouTube|id=NCdjbzMrkgk}}

<translate>== Adding configuration parameters == </translate>
<translate>
The Joomla framework allows the use of parameters stored in each component. With your favourite file manager and editor, put a file <tt>admin/config.xml</tt> file containing these lines:</translate>

<span id="admin/config.xml">
<tt>admin/config.xml</tt>
<source lang="xml">
<?xml version="1.0" encoding="utf-8"?>
<config>
<fieldset
name="greetings"
label="COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_LABEL"
description="COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_DESC"
>
<field
name="show_category"
type="radio"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
</field>
</fieldset>
</config>

</source>
</span>

<translate>
This file will be read by the ''com_config'' component of the Joomla core. For the moment, we defined only one parameter: is the category title displayed or not in the frontend.</translate>

<translate>
The best way to set the parameters is to put a ''Preferences'' button in a toolbar.</translate>

<translate>
With your favourite editor, put these lines in <tt>admin/views/helloworlds/view.html.php</tt>.</translate>

<span id="admin/views/helloworlds/view.html.php">
<tt>admin/views/helloworlds/view.html.php</tt>
<source lang="php" highlight="83">
<?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 application
$app = JFactory::getApplication();
$context = "helloworld.list.admin.helloworld";
// Get data from the model
$this->items = $this->get('Items');
$this->pagination = $this->get('Pagination');
$this->state = $this->get('State');
$this->filter_order = $app->getUserStateFromRequest($context.'filter_order', 'filter_order', 'greeting', 'cmd');
$this->filter_order_Dir = $app->getUserStateFromRequest($context.'filter_order_Dir', 'filter_order_Dir', 'asc', 'cmd');
$this->filterForm = $this->get('FilterForm');
$this->activeFilters = $this->get('ActiveFilters');

// Check for errors.
if (count($errors = $this->get('Errors')))
{
JError::raiseError(500, implode('<br />', $errors));

return false;
}

// Set the submenu
HelloWorldHelper::addSubmenu('helloworlds');

// Set the toolbar and number of found items
$this->addToolBar();

// Display the template
parent::display($tpl);

// Set the document
$this->setDocument();
}

/**
* Add the page title and toolbar.
*
* @return void
*
* @since 1.6
*/
protected function addToolBar()
{
$title = JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLDS');

if ($this->pagination->total)
{
$title .= "<span style='font-size: 0.5em; vertical-align: middle;'>(" . $this->pagination->total . ")</span>";
}

JToolBarHelper::title($title, 'helloworld');
JToolBarHelper::addNew('helloworld.add');
JToolBarHelper::editList('helloworld.edit');
JToolBarHelper::deleteList('', 'helloworlds.delete');
JToolBarHelper::preferences('com_helloworld');
}
/**
* Method to set up the document properties
*
* @return void
*/
protected function setDocument()
{
$document = JFactory::getDocument();
$document->setTitle(JText::_('COM_HELLOWORLD_ADMINISTRATION'));
}
}
</source>
</span>

<translate>== Using configuration parameters as default value == 
We want to define this parameter individually on all HelloWorld data. With your favourite editor, put these lines into the <tt>admin/models/forms/helloworld.xml</tt></translate>

<span id="admin/models/forms/helloworld.xml">
<tt>admin/models/forms/helloworld.xml</tt>
<source lang="xml" highlight="5-8,37-54">
<?xml version="1.0" encoding="utf-8"?>
<form
addrulepath="/administrator/components/com_helloworld/models/rules"
>
<fieldset
name="details"
label="COM_HELLOWORLD_HELLOWORLD_DETAILS"
>
<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=""
/>
<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>
<fields name="params">
<fieldset
name="params"
label="JGLOBAL_FIELDSET_DISPLAY_OPTIONS"
>
<field
name="show_category"
type="list"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC"
default=""
>
<option value="">JGLOBAL_USE_GLOBAL</option>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
</field>
</fieldset>
</fields>
</form>

</source>
</span>

<translate>
We define the same parameter for each message with an additional value: ''Use global''.</translate>

<translate>
Note: The ''details'' fieldset now has a label too (the same that was set in the ''edit'' view before).</translate>

<translate>== Modifying the SQL == </translate>
<translate>
Data now contains a new parameter: ''params''. The SQL structure has to be modified.
With your favourite editor, put these lines into <tt>admin/sql/install.mysql.utf8.sql</tt>:</translate>

<span id="admin/sql/install.mysql.utf8.sql">
<tt>admin/sql/install.mysql.utf8.sql</tt>
<source lang="sql" highlight="8">
DROP TABLE IF EXISTS `#__helloworld`;

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

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

</source>
</span>

<translate>
With your favourite editor, put these lines into <tt>admin/sql/updates/mysql/0.0.13.sql</tt>:</translate>

<span id="admin/sql/updates/mysql/0.0.13.sql">
<tt>admin/sql/updates/mysql/0.0.13.sql</tt>
<source lang="sql">
ALTER TABLE `#__helloworld` ADD `params` VARCHAR(1024) NOT NULL DEFAULT '';
</source>
</span>

<translate>

The <tt>TableHelloWorld</tt> has to be modified in order to deal with these parameters; they will be stored in a JSON format. We have to overload the ''bind'' method to convert the array of these parameters into a JSON string for saving in the database. With your favourite editor, put these lines into <tt>admin/tables/helloworld.php</tt>.</translate>

<span id="admin/tables/helloworld.php">
<tt>admin/tables/helloworld.php</tt>
<source lang="php" highlight="28-46">
<?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
defined('_JEXEC') or die('Restricted access');

/**
* Hello Table class
*
* @since 0.0.1
*/
class HelloWorldTableHelloWorld extends JTable
{
/**
* Constructor
*
* @param JDatabaseDriver &$db A database connector object
*/
function __construct(&$db)
{
parent::__construct('#__helloworld', 'id', $db);
}
/**
* Overloaded bind function
*
* @param array named array
* @return null|string null is operation was satisfactory, otherwise returns an error
* @see JTable:bind
* @since 1.5
*/
public function bind($array, $ignore = '')
{
if (isset($array['params']) && is_array($array['params']))
{
// Convert the params field to a string.
$parameter = new JRegistry;
$parameter->loadArray($array['params']);
$array['params'] = (string)$parameter;
}
return parent::bind($array, $ignore);
}
}

</source>
</span>

<translate>== Modifying the backend == </translate>
<translate>
The backend edit view has to display the options to the administrator. With your favourite editor, put these lines into the <tt>admin/views/helloworld/tmpl/edit.php</tt> file:</translate>

<span id="admin/views/helloworld/tmpl/edit.php">
<tt>admin/views/helloworld/tmpl/edit.php</tt>
<source lang="php" highlight="12,17-31">
<?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
defined('_JEXEC') or die('Restricted access');
JHtml::_('behavior.formvalidator');
?>
<form action="<?php echo JRoute::_('index.php?option=com_helloworld&layout=edit&id=' . (int) $this->item->id); ?>"
method="post" name="adminForm" id="adminForm" class="form-validate">
<div class="form-horizontal">
<?php foreach ($this->form->getFieldsets() as $name => $fieldset): ?>
<fieldset class="adminform">
<legend><?php echo JText::_($fieldset->label); ?></legend>
<div class="row-fluid">
<div class="span6">
<?php foreach ($this->form->getFieldset($name) as $field): ?>
<div class="control-group">
<div class="control-label"><?php echo $field->label; ?></div>
<div class="controls"><?php echo $field->input; ?></div>
</div>
<?php endforeach; ?>
</div>
</div>
</fieldset>
<?php endforeach; ?>
</div>
<input type="hidden" name="task" value="helloworld.edit" />
<?php echo JHtml::_('form.token'); ?>
</form>

</source>
</span>

<translate>
Note: The outer ''foreach'' retrieves all of the form fieldsets while the inner one gets the selected fieldset fields.<br />
This is the result of the <tt>$this->form->getFieldsets()</tt> command:</translate>

<span>
<source lang="php">
Array
(
[details] => stdClass Object
(
[name] => details
[label] => COM_HELLOWORLD_HELLOWORLD_DETAILS
[description] =>
)

[params] => stdClass Object
(
[name] => params
[label] => JGLOBAL_FIELDSET_DISPLAY_OPTIONS
[description] =>
)

)
</source>
</span>

<translate>== Modifying the frontend == 
The frontend has to be modified according to the new ''show_category'' parameter.</translate>

<translate>
We have to modify the model:
* it has to merge global parameters and individual parameters
* it has to provide the category</translate>

<translate>
With your favourite editor, put these lines into the <tt>site/models/helloworld.php</tt> file:</translate>

<span id="site/models/helloworld.php">
<tt>site/models/helloworld.php</tt>
<source lang="php" highlight="20-47,65-96">
<?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');

/**
* HelloWorld Model
*
* @since 0.0.1
*/
class HelloWorldModelHelloWorld extends JModelItem
{
/**
* @var object item
*/
protected $item;

/**
* Method to auto-populate the model state.
*
* This method should only be called once per instantiation and is designed
* to be called on the first call to the getState() method unless the model
* configuration flag to ignore the request is set.
*
* Note. Calling getState in this method will result in recursion.
*
* @return void
* @since 2.5
*/
protected function populateState()
{
// Get the message id
$jinput = JFactory::getApplication()->input;
$id = $jinput->get('id', 1, 'INT');
$this->setState('message.id', $id);

// Load the parameters.
$this->setState('params', JFactory::getApplication()->getParams());
parent::populateState();
}

/**
* Method to get a table object, load it if necessary.
*
* @param string $type The table name. Optional.
* @param string $prefix The class prefix. Optional.
* @param array $config Configuration array for model. Optional.
*
* @return JTable A JTable object
*
* @since 1.6
*/
public function getTable($type = 'HelloWorld', $prefix = 'HelloWorldTable', $config = array())
{
return JTable::getInstance($type, $prefix, $config);
}

/**
* Get the message
* @return object The message to be displayed to the user
*/
public function getItem()
{
if (!isset($this->item))
{
$id = $this->getState('message.id');
$db = JFactory::getDbo();
$query = $db->getQuery(true);
$query->select('h.greeting, h.params, c.title as category')
->from('#__helloworld as h')
->leftJoin('#__categories as c ON h.catid=c.id')
->where('h.id=' . (int)$id);
$db->setQuery((string)$query);

if ($this->item = $db->loadObject())
{
// Load the JSON string
$params = new JRegistry;
$params->loadString($this->item->params, 'JSON');
$this->item->params = $params;

// Merge global params with item params
$params = clone $this->getState('params');
$params->merge($this->item->params);
$this->item->params = $params;
}
}
return $this->item;
}
}

</source>
</span>

<translate>
The view has to ask the model for the category. With your favourite editor, put these lines into the <tt>site/views/helloworld/view.html.php</tt></translate>

<span id="site/views/helloworld/view.html.php">
<tt>site/views/helloworld/view.html.php</tt>
<source lang="php" highlight="30">
<?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');

/**
* HTML View class for the HelloWorld Component
*
* @since 0.0.1
*/
class HelloWorldViewHelloWorld 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)
{
// Assign data to the view
$this->item = $this->get('Item');

// Check for errors.
if (count($errors = $this->get('Errors')))
{
JLog::add(implode('<br />', $errors), JLog::WARNING, 'jerror');

return false;
}

// Display the view
parent::display($tpl);
}
}

</source>
</span>

<translate>
The layout can now display correctly the category or not. With your favourite editor, put these lines into <tt>site/views/helloworld/tmpl/default.php</tt></translate>

<span id="site/views/helloworld/tmpl/default.php">
<tt>site/views/helloworld/tmpl/default.php</tt>
<source lang="php" highlight="13-15">
<?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');
?>
<h1><?php echo $this->item->greeting.(($this->item->category and $this->item->params->get('show_category'))
? (' ('.$this->item->category.')') : ''); ?>
</h1>

</source>
</span>

<translate>== Adding some translation strings == 
Some strings have to be added in the <tt>admin/language/en-GB/en-GB.com_helloworld.ini</tt> file:</translate>

<span id="admin/language/en-GB/en-GB.com_helloworld.ini">
<tt>admin/language/en-GB/en-GB.com_helloworld.ini</tt>
<source lang="ini" highlight="22,23,38-40">
; Joomla! Project
; Copyright (C) 2005 - 2018 Open Source Matters. All rights reserved.
; License GNU General Public License version 2 or later; see LICENSE.txt, see LICENSE.php
; Note : All ini files need to be saved as UTF-8

COM_HELLOWORLD_ADMINISTRATION="HelloWorld - Administration"
COM_HELLOWORLD_ADMINISTRATION_CATEGORIES="HelloWorld - Categories"
COM_HELLOWORLD_NUM="#"
COM_HELLOWORLD_HELLOWORLDS_FILTER="Filters"
COM_HELLOWORLD_PUBLISHED="Published"
COM_HELLOWORLD_HELLOWORLDS_NAME="Name"
COM_HELLOWORLD_ID="Id"

COM_HELLOWORLD_HELLOWORLD_CREATING="HelloWorld - Creating"
COM_HELLOWORLD_HELLOWORLD_DETAILS="Details"
COM_HELLOWORLD_HELLOWORLD_EDITING="HelloWorld - Editing"
COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE="Some values are unacceptable"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_DESC="The category the messages belongs to"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_LABEL="Category"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC="This message will be displayed"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL="Message"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL="Show category"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC="If set to Show, the title of the message’s category will show."
COM_HELLOWORLD_HELLOWORLD_HEADING_GREETING="Greeting"
COM_HELLOWORLD_HELLOWORLD_HEADING_ID="Id"
COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT="HelloWorld manager: Edit Message"
COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW="HelloWorld manager: New Message"
COM_HELLOWORLD_MANAGER_HELLOWORLDS="HelloWorld manager"
COM_HELLOWORLD_EDIT_HELLOWORLD="Edit message"
COM_HELLOWORLD_N_ITEMS_DELETED_1="One message deleted"
COM_HELLOWORLD_N_ITEMS_DELETED_MORE="%d messages deleted"
COM_HELLOWORLD_N_ITEMS_PUBLISHED="%d message(s) published"
COM_HELLOWORLD_N_ITEMS_UNPUBLISHED="%d message(s) unpublished"
COM_HELLOWORLD_HELLOWORLD_GREETING_LABEL="Greeting"
COM_HELLOWORLD_HELLOWORLD_GREETING_DESC="Add Hello World Greeting"
COM_HELLOWORLD_SUBMENU_MESSAGES="Messages"
COM_HELLOWORLD_SUBMENU_CATEGORIES="Categories"
COM_HELLOWORLD_CONFIGURATION="HelloWorld Configuration"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_LABEL="Messages settings"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_DESC="Settings that will be applied to all messages by default"
</source>
</span>

<translate>== Packaging the component == </translate>

<translate>
Content of your code directory. Each file link below takes you to the step in the tutorial which has the latest version of that source code file. </translate>
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#helloworld.xml|helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#site/controller.php|site/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#site/models/helloworld.php|site/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding language management#site.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.ini|site/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/helloworld.php|admin/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/config.xml|admin/config.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Basic_backend#admin/controller.php|admin/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/access.xml|admin/access.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/helpers/helloworld.php|admin/helpers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/helpers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
* ''[[J3.2:Developing_an_MVC_Component/Adding_configuration#admin/sql/install.mysql.utf8.sql|admin/sql/install.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/uninstall.mysql.utf8.sql|admin/sql/uninstall.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/install.mysql.utf8.sql|admin/sql/updates/mysql/0.0.6.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/sql/updates/mysql/0.0.12.sql|admin/sql/updates/mysql/0.0.12.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/sql/updates/mysql/0.0.13.sql|admin/sql/updates/mysql/0.0.13.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/fields/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/models/fields/helloworld.php|admin/models/fields/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/models/helloworlds.php|admin/models/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/models/helloworld.php|admin/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding decorations to the backend#admin/models/forms/filter_helloworlds.xml|admin/models/forms/filter_helloworlds.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/forms/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/models/forms/helloworld.js|admin/models/forms/helloworld.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/models/forms/helloworld.xml|admin/models/forms/helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/models/rules/greeting.php|admin/models/rules/greeting.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/rules/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_backend_actions#admin/controllers/helloworld.php|admin/controllers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_backend_actions#admin/controllers/helloworlds.php|admin/controllers/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/controllers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/views/helloworld/view.html.php|admin/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/views/helloworld/tmpl/edit.php|admin/views/helloworld/tmpl/edit.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/views/helloworld/submitbutton.js|admin/views/helloworld/submitbutton.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/views/helloworlds/view.html.php|admin/views/helloworlds/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/views/helloworlds/tmpl/default.php|admin/views/helloworlds/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/tables/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/tables/helloworld.php|admin/tables/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding_configuration#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.ini|admin/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding_decorations_to_the_backend#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.sys.ini|admin/language/en-GB/en-GB.com_helloworld.sys.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/images/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-16x16.png]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-48x48.png]]''

<translate>
Create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-13-adding-configuration.zip archive] and install it using the extension manager of Joomla. You can add a menu item of this component using the menu manager in the backend.</translate>

<span id="helloworld.xml">
<tt>helloworld.xml</tt>
<source lang="xml" highlight="13,64">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.0" method="upgrade">

<name>COM_HELLOWORLD</name>

<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>

<version>0.0.13</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>
</files>

<languages folder="site/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
</languages>

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

<administration>

<menu link='index.php?option=com_helloworld' img="../media/com_helloworld/images/tux-16x16.png">COM_HELLOWORLD_MENU</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>config.xml</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<filename>access.xml</filename>

<folder>sql</folder>

<folder>tables</folder>

<folder>models</folder>

<folder>views</folder>

<folder>controllers</folder>

<folder>helpers</folder>
</files>
<languages folder="admin/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
<language tag="en-GB">en-GB/en-GB.com_helloworld.sys.ini</language>
</languages>
</administration>

</extension>
</source>
</span>

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Robbiej|Robbie Jackson]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding categories|Prev: Adding categories</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding ACL|Next: Adding ACL</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
[[Category:Joomla! 3.x{{#translation:}}]]
[[Category:Joomla! 3.0{{#translation:}}]]
[[Category:Joomla! 3.1{{#translation:}}]]
[[Category:Joomla! 3.2{{#translation:}}]]
[[Category:Joomla! 3.3{{#translation:}}]]
[[Category:Joomla! 3.4{{#translation:}}]]
[[Category:Beginner Development{{#translation:}}]]
[[Category:Component Development{{#translation:}}]]
[[Category:Tutorials{{#translation:}}]]
[[Category:Tutorials in a Series{{#translation:}}]]
</noinclude>

J3.x:Developing an MVC Component/Adding a Modal

2020-02-20T09:25:52Z

Es ka: fix typo in admin/views/helloworlds/tmpl/modal.php

<noinclude><languages /></noinclude>
{{:J3.1:Developing an MVC Component/<translate>

en</translate>}}
<translate>

This tutorial is part of the [[S:MyLanguage/J3.2:Developing an MVC Component | Developing an MVC Component for Joomla! 3.2]] tutorial. You are encouraged to read the previous parts of the tutorial before reading this.</translate>
<translate>

In this step we add a modal, and an accompanying video is available at [https://youtu.be/5qJ6qT9dpXQ Adding a Modal].</translate>

{{#widget:YouTube|id=5qJ6qT9dpXQ}}

<translate>
== Introduction == </translate>
<translate>

Modals, or modal windows, are the pop-up-like windows which appear in several places within Joomla. Examples are:</translate>
<translate>

* When as an administrator you create a new menu item, and select a Menu Item Type of Articles / Single Article, then when you click to select the article, a pop-up appears displaying the details of the articles available and allowing you to select one.</translate>
<translate>

* If you enabled the Administrator Multilanguage Status module as part of making your site multilingual in the previous step, then when you click on the "Multilingual Status" button at the bottom left of each admin page, a pop-up appears which shows the status of the multilingual functionality on your site.</translate>

<translate>

Of course, these modals aren't really browser pop-up windows - users often disable browser pop-up windows - but rather use CSS and Javascript to give the appearance of pop-ups, and Joomla currently uses the [https://getbootstrap.com/docs/4.0/components/modal/ Bootstrap Modal] framework.</translate> <translate> The HTML elements which comprise the modal are already within the HTML of the page, but hidden. When you click on an appropriate button (such as the Select button to select an article in the first example above), then the javascript code behind the button click does the following:</translate>
<translate>

* the HTML hidden elements of the modal are made visible</translate>
<translate>

* a new div element covering the whole of the browser window is created; this backdrop is coloured black, and has partial opacity, so this gives the appearance of greying out what's behind the modal</translate>
<translate>

* in the CSS the z-index is defined so that the modal appears above the backdrop.</translate>

<translate>

When you close the modal by selecting eg an article, or by clicking the close button, then the HTML elements of the modal are made hidden once more, the backdrop div is removed and any item you selected is passed by javascript to the appropriate field on the main form.</translate>

<translate>

Each modal consists of 3 parts:</translate>
<translate>

* a modal header at the top, usually with the title and an X button to close the modal,</translate>
<translate>

* a modal body, where the main information appears, and,</translate>
<translate>

* a modal footer, with buttons such as Close, Save, etc, depending upon the context.</translate>

<translate>

In general within Joomla the modal body is an iframe element, and hence is an embedded HTML page within the overall page, and HTTP requests can be made to obtain the data to display in the iframe, filter and sort it, and so on.</translate>

<translate>
== Functionality == 
</translate>

<translate>

Currently within our helloworld component we have the ability to create a new menu item with a menu item type of "hello world" which will display a single helloworld message on our site. However, in choosing the message to display we have only a simple list field, and we have to scroll down the list of greetings to select the appropriate one. </translate>

<translate>

In this step we change the user interface so that when selecting the helloworld message for a new menu item, the administrator is presented with a modal with all the details of the helloworld records, similar to what is shown when the administrator clicks on Components / Hello World. In this way the administrator is presented with a much nicer interface, with ordering, search and filter functionality. </translate>

<translate>
== Approach == 
</translate>

<translate>

The definition of what is displayed when an admin selects a menuitem of type Hello World is defined in the xml file of the site helloworld layout file, ie site/views/helloworld/tmpl/default.xml. We need to change the field definition in that file to be a custom field type which we'll call modal_helloworld.</translate>

<translate>

We need to provide Joomla with the code for our custom field, and we'll provide a new file to generate the html to display our custom input field. </translate>

<translate>

Finally we need to consider the display of the helloworld records within our modal. We'll use a presentation similar to that shown when the administrator navigates to Components / Hello world, so we'll reuse our helloworlds view, but we'll generate a new layout file instead of our current admin views/helloworlds/tmpl/default.php. </translate>

<translate>
== Helloworld menuitem definition == 
</translate>

<translate> We change the custom field for selecting the Helloworld record to be displayed.</translate>

<span id="site/views/helloworld/tmpl/default.xml">
<tt>'''site/views/helloworld/tmpl/default.xml'''</tt>
<source lang="xml" highlight="13-14">
<?xml version="1.0" encoding="utf-8"?>
<metadata>
<layout title="COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE">
<message>COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_DESC</message>
</layout>
<fields
name="request"
addfieldpath="/administrator/components/com_helloworld/models/fields"
>
<fieldset name="request">
<field
name="id"
type="modal_helloworld"
required="true"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC"
/>
</fieldset>
</fields>
</metadata>
</source>
</span>

<translate>
== Field definition == 
</translate>

<translate>

The field definition for our new custom field goes into the admin/models/fields directory. Because the field type is called modal_helloworld, with an underscore in between, Joomla will look in a /modal subdirectory for a file helloworld.php. Hence our new custom field is defined in </translate>

<span id="admin/models/fields/modal/helloworld.php">
<tt>'''admin/models/fields/modal/helloworld.php'''</tt>
<source lang="php">
<?php

defined('JPATH_BASE') or die;

/**
* Supports a modal for selecting a helloworld record
*
*/
class JFormFieldModal_Helloworld extends JFormField
{
/**
* Method to get the html for the input field.
*
* @return string The field input html.
*/
protected function getInput()
{
// Load language
JFactory::getLanguage()->load('com_helloworld', JPATH_ADMINISTRATOR);

// $this->value is set if there's a default id specified in the xml file
$value = (int) $this->value > 0 ? (int) $this->value : '';

// $this->id will be jform_request_xxx where xxx is the name of the field in the xml file
$modalId = 'Helloworld_' . $this->id;

// Add the modal field script to the document head.
JHtml::_('jquery.framework');
JHtml::_('script', 'system/modal-fields.js', array('version' => 'auto', 'relative' => true));

// our callback function from the modal to the main window:
JFactory::getDocument()->addScriptDeclaration("
function jSelectHelloworld_" . $this->id . "(id, title, catid, object, url, language) {
window.processModalSelect('Helloworld', '" . $this->id . "', id, title, catid, object, url, language);
}
");

// if a default id is set, then get the corresponding greeting to display it
if ($value)
{
$db = JFactory::getDbo();
$query = $db->getQuery(true)
->select($db->quoteName('greeting'))
->from($db->quoteName('#__helloworld'))
->where($db->quoteName('id') . ' = ' . (int) $value);
$db->setQuery($query);

try
{
$title = $db->loadResult();
}
catch (RuntimeException $e)
{
JError::raiseWarning(500, $e->getMessage());
}
}

// display the default greeting or "Select" if no default specified
$title = empty($title) ? JText::_('COM_HELLOWORLD_MENUITEM_SELECT_HELLOWORLD') : htmlspecialchars($title, ENT_QUOTES, 'UTF-8');
$html = '<span class="input-append">';
$html .= '<input class="input-medium" id="' . $this->id . '_name" type="text" value="' . $title . '" disabled="disabled" size="35" />';

// html for the Select button
$html .= '<a'
. ' class="btn hasTooltip' . ($value ? ' hidden' : '') . '"'
. ' id="' . $this->id . '_select"'
. ' data-toggle="modal"'
. ' role="button"'
. ' href="#ModalSelect' . $modalId . '"'
. ' title="' . JHtml::tooltipText('COM_HELLOWORLD_MENUITEM_SELECT_BUTTON_TOOLTIP') . '">'
. '<span class="icon-file" aria-hidden="true"></span> ' . JText::_('JSELECT')
. '</a>';

// html for the Clear button
$html .= '<a'
. ' class="btn' . ($value ? '' : ' hidden') . '"'
. ' id="' . $this->id . '_clear"'
. ' href="#"'
. ' onclick="window.processModalParent(\'' . $this->id . '\'); return false;">'
. '<span class="icon-remove" aria-hidden="true"></span>' . JText::_('JCLEAR')
. '</a>';

$html .= '</span>';

// url for the iframe
$linkHelloworlds = 'index.php?option=com_helloworld&view=helloworlds&layout=modal&tmpl=component&' . JSession::getFormToken() . '=1';
$urlSelect = $linkHelloworlds . '&function=jSelectHelloworld_' . $this->id;

// title to go in the modal header
$modalTitle = JText::_('COM_HELLOWORLD_MENUITEM_SELECT_MODAL_TITLE');

// html to set up the modal iframe
$html .= JHtml::_(
'bootstrap.renderModal',
'ModalSelect' . $modalId,
array(
'title' => $modalTitle,
'url' => $urlSelect,
'height' => '400px',
'width' => '800px',
'bodyHeight' => '70',
'modalWidth' => '80',
'footer' => '<a role="button" class="btn" data-dismiss="modal" aria-hidden="true">' . JText::_('JLIB_HTML_BEHAVIOR_CLOSE') . '</a>',
)
);

// class='required' for client side validation.
$class = $this->required ? ' class="required modal-value"' : '';

// hidden input field to store the helloworld record id
$html .= '<input type="hidden" id="' . $this->id . '_id" ' . $class
. ' data-required="' . (int) $this->required . '" name="' . $this->name
. '" data-text="' . htmlspecialchars(JText::_('COM_HELLOWORLD_MENUITEM_SELECT_HELLOWORLD', true), ENT_COMPAT, 'UTF-8')
. '" value="' . $value . '" />';

return $html;
}

/**
* Method to get the html for the label field.
*
* @return string The field label html.
*/
protected function getLabel()
{
return str_replace($this->id, $this->id . '_id', parent::getLabel());
}
}
</source>
</span>

<translate>

When the field definition class extends JFormField, Joomla expects 2 methods to be present in the class: getInput() which should return the html for the input field elements and getLabel() which should return the html for the label. </translate>

<translate>

There are several core Joomla components which use modal fields to allow the administrator to select items, including com_content and com_contact. These components have similar field definitions, and the file above is a cut-down version of these equivalents, just supporting the functionality which we need for this tutorial step.</translate>

<translate>

There are a number of key html input elements returned by the getInput() method above.</translate>
<translate>

# The input field which displays the current greeting selected, or the text "Select" if none has been selected</translate>
<translate>

# The Select button - this appears if no greeting has been selected. Note the attribute data-toggle="modal" indicating that clicking on this button will cause the modal to appear</translate>
<translate>

# The Clear button - this appears if a greeting has been selected. When clicked it runs a javascript function within the system/modal-fields.js code which replaces the selected greeting the "Select" text, makes visible the Select button, and hides the Clear button</translate>
<translate>

# The modal elements - these are output through including sections of the Bootstrap html and javascript code. When the modal appears the iframe is created and populated through an HTTP GET to the URL in <tt>$urlSelect</tt>.</translate>
<translate>

# A hidden field which stores the id of the helloworld record selected, and which will be used to pass it in the HTTP POST parameters when the form is submitted. </translate>

<translate>

In our case the callback function will be called <tt>jSelectHelloworld_jform_request_id</tt>, and this is the function we want to be called from the modal to pass the id and greeting of the selected helloworld record. Knowing this, <tt>window.processModalSelect</tt> will set the input fields for the greeting and id, and set the visibility of the Select and Clear buttons. </translate>

<translate>

The modal knows that this is the name of the function to call because it's passed as the <tt>&function=jSelectHelloworld_jform_request_id</tt> parameter within the URL of the iframe.</translate>

<translate>

Note also the <tt>&tmpl=component</tt> parameter in the URL. This means that the component.php file within the directory of the installed template will be used, which presents an html page without the Joomla menus, etc. </translate>

<translate>
== Modal Display == 
</translate>

<translate>

For the modal display we use the same MVC as the admin "helloworlds" functionality. Neither the controller nor model require changing, there is a small change to the view file, and there's a new layout file, which is similar to the default.php layout file, but differs in some important respects.</translate>

<translate>

In the view file, we don't display the toolbar buttons nor the sidebar to choose between Messages and Categories (and some old comments have been removed as well).</translate>

<span id="admin/views/helloworlds/view.html.php">
<tt>admin/views/helloworlds/view.html.php</tt>
<source lang="php" highlight="50-55">
<?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 application
$app = JFactory::getApplication();
$context = "helloworld.list.admin.helloworld";
// Get data from the model
$this->items = $this->get('Items');
$this->pagination = $this->get('Pagination');
$this->state = $this->get('State');
$this->filterForm = $this->get('FilterForm');
$this->activeFilters = $this->get('ActiveFilters');

// What Access Permissions does this user have? What can (s)he do?
$this->canDo = JHelperContent::getActions('com_helloworld');

// Check for errors.
if (count($errors = $this->get('Errors')))
{
JError::raiseError(500, implode('<br />', $errors));

return false;
}

// Set the sidebar submenu and toolbar, but not on the modal window
if ($this->getLayout() !== 'modal')
{
HelloWorldHelper::addSubmenu('helloworlds');
$this->addToolBar();
}

// Display the template
parent::display($tpl);

// Set the document
$this->setDocument();
}

/**
* Add the page title and toolbar.
*
* @return void
*
* @since 1.6
*/
protected function addToolBar()
{
$title = JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLDS');

if ($this->pagination->total)
{
$title .= "<span style='font-size: 0.5em; vertical-align: middle;'>(" . $this->pagination->total . ")</span>";
}

JToolBarHelper::title($title, 'helloworld');
if ($this->canDo->get('core.create'))
{
JToolBarHelper::addNew('helloworld.add', 'JTOOLBAR_NEW');
}
if ($this->canDo->get('core.edit'))
{
JToolBarHelper::editList('helloworld.edit', 'JTOOLBAR_EDIT');
}
if ($this->canDo->get('core.delete'))
{
JToolBarHelper::deleteList('', 'helloworlds.delete', 'JTOOLBAR_DELETE');
}
if ($this->canDo->get('core.admin'))
{
JToolBarHelper::divider();
JToolBarHelper::preferences('com_helloworld');
}
}
/**
* Method to set up the document properties
*
* @return void
*/
protected function setDocument()
{
$document = JFactory::getDocument();
$document->setTitle(JText::_('COM_HELLOWORLD_ADMINISTRATION'));
}
}
</source>
</span>

<translate>

Our new modal layout file:</translate>

<span id="admin/views/helloworlds/tmpl/modal.php">
<tt>admin/views/helloworlds/tmpl/modal.php</tt>
<source lang="php">
<?php
/**
* Layout file for the admin modal display of helloworld records
*
*/

defined('_JEXEC') or die('Restricted Access');

use Joomla\Registry\Registry;

JHtml::_('behavior.core');
JHtml::_('script', 'com_helloworld/admin-helloworlds-modal.js', array('version' => 'auto', 'relative' => true));

$listOrder = $this->escape($this->state->get('list.ordering'));
$listDirn = $this->escape($this->state->get('list.direction'));

$app = JFactory::getApplication();
$function = $app->input->getCmd('function', 'jSelectHelloworld');
$onclick = $this->escape($function);
?>
<div class="container-popup">

<form action="<?php echo JRoute::_('index.php?option=com_helloworld&view=helloworlds&layout=modal&tmpl=component&function=' . $function . '&' . JSession::getFormToken() . '=1'); ?>" method="post" name="adminForm" id="adminForm" class="form-inline">

<?php echo JLayoutHelper::render('joomla.searchtools.default', array('view' => $this)); ?>

<div class="clearfix"></div>

<table class="table table-striped table-hover">
<thead>
<tr>
<th width="3%"><?php echo JText::_('COM_HELLOWORLD_NUM'); ?></th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_HELLOWORLDS_NAME', 'greeting', $listDirn, $listOrder); ?>
</th>
<th width="15%">
<?php echo JText::_('COM_HELLOWORLD_HELLOWORLDS_POSITION'); ?>
</th>
<th width="15%">
<?php echo JText::_('COM_HELLOWORLD_HELLOWORLDS_IMAGE'); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_AUTHOR', 'author', $listDirn, $listOrder); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_LANGUAGE', 'language', $listDirn, $listOrder); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_CREATED_DATE', 'created', $listDirn, $listOrder); ?>
</th>
<th width="5%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_PUBLISHED', 'published', $listDirn, $listOrder); ?>
</th>
<th width="2%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_ID', 'id', $listDirn, $listOrder); ?>
</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) :
$row->image = new Registry;
$row->image->loadString($row->imageinfo);
if ($row->language && JLanguageMultilang::isEnabled())
{
$tag = strlen($row->language);
if ($tag == 5)
{
$lang = substr($row->language, 0, 2);
}
elseif ($tag == 6)
{
$lang = substr($row->language, 0, 3);
}
else {
$lang = '';
}
}
elseif (!JLanguageMultilang::isEnabled())
{
$lang = '';
}
?>
<tr>
<td><?php echo $this->pagination->getRowOffset($i); ?></td>
<td>
<?php
$link = 'index.php?option=com_helloworld&view=helloworld&id=' . $row->id;
$attribs = 'data-function="' . $this->escape($onclick) . '"'
. ' data-id="' . $row->id . '"'
. ' data-title="' . $this->escape(addslashes($row->greeting)) . '"'
. ' data-uri="' . $link . '"'
. ' data-language="' . $this->escape($lang) . '"'
;
?>
<a class="select-link" href="javascript:void(0)" <?php echo $attribs; ?>>
<?php echo $this->escape($row->greeting); ?>
</a>
<span class="small break-word">
<?php echo JText::sprintf('JGLOBAL_LIST_ALIAS', $this->escape($row->alias)); ?>
</span>
<div class="small">
<?php echo JText::_('JCATEGORY') . ': ' . $this->escape($row->category_title); ?>
</div>
</td>
<td align="center">
<?php echo "[" . $row->latitude . ", " . $row->longitude . "]"; ?>
</td>
<td align="center">
<?php
$caption = $row->image->get('caption') ? : '' ;
$src = JURI::root() . ($row->image->get('image') ? : '' );
$html = '<p class="hasTooltip" style="display: inline-block" data-html="true" data-toggle="tooltip" data-placement="right" title="<img width=\'100px\' height=\'100px\' src=\'%s\'>">%s</p>';
echo sprintf($html, $src, $caption); ?>
</td>
<td align="center">
<?php echo $row->author; ?>
</td>
<td align="center">
<?php echo JLayoutHelper::render('joomla.content.language', $row); ?>
</td>
<td align="center">
<?php echo substr($row->created, 0, 10); ?>
</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>
<input type="hidden" name="task" value=""/>
<input type="hidden" name="boxchecked" value="0"/>
<?php echo JHtml::_('form.token'); ?>
</form>
</div>
</source>
</span>

<translate>

Note that there are some important differences from the default.php layout file.</translate>

<translate>

# We get the <tt>function</tt> parameter which is embedded in the iframe URL as a query parameter, and we use this in the URL target of the <tt><form></tt> element and in the <tt>data-function</tt> attribute of the each greeting value. </translate>
<translate>

# There are several other data attributes associated with each greeting value; these will be used to pass this information to the parent window via the jSelectHelloworld_jform_request_id function call. Also, each greeting has a CSS class of "select-link".</translate>
<translate>

# We need to set the target URL of the <tt><form></tt> to be the same as the URL of the iframe. This is because whenever the administrator uses the search / filter tools the form sends an HTTP request to that URL, and we need to ensure it's the same data that gets presented.</translate>

<translate>

Also, the checkboxes have been removed, as they are now irrelevant. </translate>

<translate>

In addition, we need a small javascript file which basically sets an onclick listener on each of the greetings (identified through having the class "select-link"), and calls the required function when triggered. </translate>

<span id="media/js/admin-helloworlds-modal.js">
<tt>media/js/admin-helloworlds-modal.js</tt>
<source lang="javascript">
(function() {
"use strict";
/**
* Javascript to set up onclick listeners on the helloworld greetings
* When a greeting is clicked the listener invokes the function in the parent window
* which is given by the data-function attribute of the helloworld greeting html element
* In this way the identity of the helloworld record selected in the modal is passed to the field in the parent window
*/

document.addEventListener('DOMContentLoaded', function(){

var elements = document.querySelectorAll('.select-link');

for(var i = 0, l = elements.length; l>i; i++) {

elements[i].addEventListener('click', function (event) {
event.preventDefault();
var functionName = event.target.getAttribute('data-function');
window.parent[functionName](event.target.getAttribute('data-id'), event.target.getAttribute('data-title'), null, null, event.target.getAttribute('data-uri'), event.target.getAttribute('data-language'), null);
})
}
});
})();

</source>
</span>

<translate>

== Updated Language Strings == 
</translate>

<span id="admin/language/en-GB/en-GB.com_helloworld.ini">
<tt>admin/language/en-GB/en-GB.com_helloworld.ini</tt>
<source lang="text" highlight="86-89">
; Joomla! Project
; Copyright (C) 2005 - 2018 Open Source Matters. All rights reserved.
; License GNU General Public License version 2 or later; see LICENSE.txt, see LICENSE.php
; Note : All ini files need to be saved as UTF-8

COM_HELLOWORLD_ADMINISTRATION="HelloWorld - Administration"
COM_HELLOWORLD_ADMINISTRATION_CATEGORIES="HelloWorld - Categories"
COM_HELLOWORLD_NUM="#"
COM_HELLOWORLD_HELLOWORLDS_FILTER="Filters"
COM_HELLOWORLD_AUTHOR="Author"
COM_HELLOWORLD_LANGUAGE="Language"
COM_HELLOWORLD_CREATED_DATE="Created"
COM_HELLOWORLD_PUBLISHED="Published"
COM_HELLOWORLD_HELLOWORLDS_NAME="Name"
COM_HELLOWORLD_HELLOWORLDS_POSITION="Position"
COM_HELLOWORLD_HELLOWORLDS_IMAGE="Image"
COM_HELLOWORLD_ID="Id"

COM_HELLOWORLD_HELLOWORLD_CREATING="HelloWorld - Creating"
COM_HELLOWORLD_HELLOWORLD_DETAILS="Details"
COM_HELLOWORLD_HELLOWORLD_EDITING="HelloWorld - Editing"
COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE="Some values are unacceptable"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_DESC="The category the messages belongs to"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_LABEL="Category"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC="This message will be displayed"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL="Message"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL="Show category"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC="If set to Show, the title of the message’s category will show."
COM_HELLOWORLD_HELLOWORLD_FIELD_LATITUDE_LABEL="Latitude"
COM_HELLOWORLD_HELLOWORLD_FIELD_LATITUDE_DESC="Enter the position latitude, between -90 and +90 degrees"
COM_HELLOWORLD_HELLOWORLD_FIELD_LONGITUDE_LABEL="Longitude"
COM_HELLOWORLD_HELLOWORLD_FIELD_LONGITUDE_DESC="Enter the position longitude, between -180 and +180 degrees"
COM_HELLOWORLD_HELLOWORLD_FIELD_LANGUAGE_DESC="Select the appropriate language"
COM_HELLOWORLD_IMAGE_FIELDS="Image details"
COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_LABEL="Select image"
COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_DESC="Select an image from the library, or upload a new one"
COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_LABEL="Alt text"
COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_DESC="Alternative text (if image cannot be displayed)"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_LABEL="Caption"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_DESC="Provide a caption for the image"
COM_HELLOWORLD_HELLOWORLD_HEADING_GREETING="Greeting"
COM_HELLOWORLD_HELLOWORLD_HEADING_ID="Id"
COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT="HelloWorld manager: Edit Message"
COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW="HelloWorld manager: New Message"
COM_HELLOWORLD_MANAGER_HELLOWORLDS="HelloWorld manager"
COM_HELLOWORLD_EDIT_HELLOWORLD="Edit message"
COM_HELLOWORLD_N_ITEMS_DELETED_1="One message deleted"
COM_HELLOWORLD_N_ITEMS_DELETED_MORE="%d messages deleted"
COM_HELLOWORLD_N_ITEMS_PUBLISHED="%d message(s) published"
COM_HELLOWORLD_N_ITEMS_UNPUBLISHED="%d message(s) unpublished"
COM_HELLOWORLD_HELLOWORLD_GREETING_LABEL="Greeting"
COM_HELLOWORLD_HELLOWORLD_GREETING_DESC="Add Hello World Greeting"
COM_HELLOWORLD_SUBMENU_MESSAGES="Messages"
COM_HELLOWORLD_SUBMENU_CATEGORIES="Categories"
COM_HELLOWORLD_CONFIGURATION="HelloWorld Configuration"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_LABEL="Messages settings"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_DESC="Settings that will be applied to all messages by default"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_LABEL="Captcha"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_DESC="Select Captcha to use on front end form"
COM_HELLOWORLD_HELLOWORLD_FIELD_USER_TO_EMAIL_LABEL="User to email"
COM_HELLOWORLD_HELLOWORLD_FIELD_USER_TO_EMAIL_DESC="Select user to email when a new message is entered on front end"
COM_HELLOWORLD_FIELDSET_RULES="Message Permissions"
COM_HELLOWORLD_FIELD_RULES_LABEL="Permissions"
COM_HELLOWORLD_ACCESS_DELETE_DESC="Is this group allowed to edit this message?"
COM_HELLOWORLD_ACCESS_DELETE_DESC="Is this group allowed to delete this message?"
COM_HELLOWORLD_TAB_NEW_MESSAGE="New Message"
COM_HELLOWORLD_TAB_EDIT_MESSAGE="Message Details"
COM_HELLOWORLD_TAB_PARAMS="Parameters"
COM_HELLOWORLD_TAB_PERMISSIONS="Permissions"
COM_HELLOWORLD_TAB_IMAGE="Image"
COM_HELLOWORLD_LEGEND_DETAILS="Message Details"
COM_HELLOWORLD_LEGEND_PARAMS="Message Parameters"
COM_HELLOWORLD_LEGEND_PERMISSIONS="Message Permissions"
COM_HELLOWORLD_LEGEND_IMAGE="Image info"
; Column ordering in the Helloworlds view
COM_HELLOWORLD_ORDERING_ASC="Greeting ascending"
COM_HELLOWORLD_ORDERING_DESC="Greeting descending"
COM_HELLOWORLD_AUTHOR_ASC="Author ascending"
COM_HELLOWORLD_AUTHOR_DESC="Author descending"
COM_HELLOWORLD_CREATED_ASC="Creation date ascending"
COM_HELLOWORLD_CREATED_DESC="Creation date descending"
COM_HELLOWORLD_PUBLISHED_ASC="Unpublished first"
COM_HELLOWORLD_PUBLISHED_DESC="Published first"
COM_HELLOWORLD_LANGUAGE_ASC="Language ascending"
COM_HELLOWORLD_LANGUAGE_DESC="Language descending"
; Helloworld menuitem - selecting a greeting via modal
COM_HELLOWORLD_MENUITEM_SELECT_MODAL_TITLE="Select greeting"
COM_HELLOWORLD_MENUITEM_SELECT_HELLOWORLD="Select"
COM_HELLOWORLD_MENUITEM_SELECT_BUTTON_TOOLTIP="Select a helloworld greeting"
</source>
</span>

<translate>
== Packaging the Component == 
</translate>
<translate>

Contents of your code directory. Each file link below takes you to the step in the tutorial which has the latest version of that source code file.</translate>

* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#helloworld.xml|helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an install-uninstall-update script file#script.php|script.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/router.php|site/router.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding AJAX#site/controller.php|site/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/controllers/helloworld.php|site/controllers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Map#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding AJAX#site/views/helloworld/view.json.php|site/views/helloworld/view.json.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding AJAX#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/form/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/views/form/view.html.php|site/views/form/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/form/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/views/form/tmpl/edit.php|site/views/form/tmpl/edit.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#site/views/form/tmpl/edit.xml|site/views/form/tmpl/edit.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/category/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/views/category/view.html.php|site/views/category/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/category/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/views/category/tmpl/default.php|site/views/category/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#site/views/category/tmpl/default.xml|site/views/category/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/models/helloworld.php|site/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#site/models/form.php|site/models/form.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/models/category.php|site/models/category.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/models/forms/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/models/forms/add-form.xml|site/models/forms/add-form.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_alias#site/models/forms/filter_category.xml|site/models/forms/filter_category.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Using the language filter facility#site/language/en-GB/en-GB.com_helloworld.ini|site/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/helpers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/helpers/route.php|site/helpers/route.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/helpers/category.php|site/helpers/category.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/helloworld.php|admin/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/config.xml|admin/config.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Basic_backend#admin/controller.php|admin/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/access.xml|admin/access.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/helpers/helloworld.php|admin/helpers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/helpers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/sql/install.mysql.utf8.sql|admin/sql/install.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/uninstall.mysql.utf8.sql|admin/sql/uninstall.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/install.mysql.utf8.sql|admin/sql/updates/mysql/0.0.6.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/sql/updates/mysql/0.0.12.sql|admin/sql/updates/mysql/0.0.12.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/sql/updates/mysql/0.0.13.sql|admin/sql/updates/mysql/0.0.13.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/sql/updates/mysql/0.0.14.sql|admin/sql/updates/mysql/0.0.14.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#admin/sql/updates/mysql/0.0.16.sql|admin/sql/updates/mysql/0.0.16.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/sql/updates/mysql/0.0.17.sql|admin/sql/updates/mysql/0.0.17.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Map#admin/sql/updates/mysql/0.0.18.sql|admin/sql/updates/mysql/0.0.18.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/sql/updates/mysql/0.0.20.sql|admin/sql/updates/mysql/0.0.20.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/sql/updates/mysql/0.0.21.sql|admin/sql/updates/mysql/0.0.21.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/fields/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/models/fields/helloworld.php|admin/models/fields/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/fields/modal/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#admin/models/fields/modal/helloworld.php|admin/models/fields/modal/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/models/helloworlds.php|admin/models/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/models/helloworld.php|admin/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/models/forms/filter_helloworlds.xml|admin/models/forms/filter_helloworlds.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/forms/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/models/forms/helloworld.js|admin/models/forms/helloworld.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/models/forms/helloworld.xml|admin/models/forms/helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/models/rules/greeting.php|admin/models/rules/greeting.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/rules/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/controllers/helloworld.php|admin/controllers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_backend_actions#admin/controllers/helloworlds.php|admin/controllers/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/controllers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/views/helloworld/view.html.php|admin/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/views/helloworld/tmpl/edit.php|admin/views/helloworld/tmpl/edit.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/views/helloworld/submitbutton.js|admin/views/helloworld/submitbutton.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#admin/views/helloworlds/view.html.php|admin/views/helloworlds/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/views/helloworlds/tmpl/default.php|admin/views/helloworlds/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#admin/views/helloworlds/tmpl/modal.php|admin/views/helloworlds/tmpl/modal.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/tables/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_alias#admin/tables/helloworld.php|admin/tables/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding a Modal#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.ini|admin/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding an alias#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.sys.ini|admin/language/en-GB/en-GB.com_helloworld.sys.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/images/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-16x16.png]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-48x48.png]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/js/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#media/js/openstreetmap.js|media/js/openstreetmap.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#media/js/admin-helloworlds-modal.js|media/js/admin-helloworlds-modal.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/css/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Map#index.html|media/css/openstreetmap.css]]''

<span id="helloworld.xml">
<tt>helloworld.xml</tt>
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.0" method="upgrade">

<name>COM_HELLOWORLD</name>

<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>

<version>0.0.22</version>

<description>COM_HELLOWORLD_DESCRIPTION</description>


<scriptfile>script.php</scriptfile>

<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>
<filename>router.php</filename>
<folder>controllers</folder>
<folder>views</folder>
<folder>models</folder>
<folder>helpers</folder>
</files>

<languages folder="site/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
<language tag="fr-FR">fr-FR/fr-FR.com_helloworld.ini</language>
</languages>

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

<administration>

<menu link='index.php?option=com_helloworld' img="../media/com_helloworld/images/tux-16x16.png">COM_HELLOWORLD_MENU</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>config.xml</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<filename>access.xml</filename>

<folder>sql</folder>

<folder>tables</folder>

<folder>models</folder>

<folder>views</folder>

<folder>controllers</folder>

<folder>helpers</folder>
</files>
<languages folder="admin/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
<language tag="en-GB">en-GB/en-GB.com_helloworld.sys.ini</language>
<language tag="fr-FR">fr-FR/fr-FR.com_helloworld.ini</language>
<language tag="fr-FR">fr-FR/fr-FR.com_helloworld.sys.ini</language>
</languages>
</administration>

</extension>
</source>
</span>

<translate>
== Contributors == 
</translate>
*[[User:Robbiej|Robbie Jackson]]

<div class="row">
<div class="large-6 columns">{{Basic button|
S:MyLanguage/J3.x:Developing_an_MVC_Component/Using the language filter facility|<translate> Prev: Using the language filter facility</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding Associations|<translate> Next: Adding Associations</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
[[Category:Joomla! 3.x{{#translation:}}]]
[[Category:Joomla! 3.0{{#translation:}}]]
[[Category:Joomla! 3.1{{#translation:}}]]
[[Category:Joomla! 3.2{{#translation:}}]]
[[Category:Joomla! 3.3{{#translation:}}]]
[[Category:Joomla! 3.4{{#translation:}}]]
[[Category:Beginner Development{{#translation:}}]]
[[Category:Component Development{{#translation:}}]]
[[Category:Tutorials{{#translation:}}]]
[[Category:Tutorials in a Series{{#translation:}}]]
</noinclude>

J3.x:Developing an MVC Component/Adding a Modal/de

2020-02-20T09:06:55Z

Es ka: fixed formatting

<noinclude><languages /></noinclude>
{{:J3.1:Developing an MVC Component/de}}
Dieses Tutorial ist ein Teil der [[S:MyLanguage/J3.2:Developing an MVC Component | Entwicklung einer MVC Komponente für Joomla! 3.2]] Artikel-Serie. Es ist sehr sinnvoll, die vorherigen Teile des Tutorials zu lesen, bevor du hier fortfährst.
In diesem Schritt fügen wir ein Modal hinzu, ein Begleitvideo ist unter [https://youtu.be/5qJ6qT9dpXQ Ein Modal hinzufügen] verfügbar.

{{#widget:YouTube|id=5qJ6qT9dpXQ}}

==Einführung==
Modale, oder modale Fenster, sind ähnlich wie die Popup-Fenster, die an verschiedenen Stellen in Joomla! erscheinen. Beispiele sind:
* Wenn du als Administrator ein neues Menüelement erstellst und als Menüelementtyp Beiträge / Einzelartikel auswählst, wird beim Klicken auf den Artikel ein Popup angezeigt, in dem die Details der verfügbaren Artikel angezeigt werden und du einen auswählen kannst.
* Wenn du das Modul Administrator - Mehrsprachigkeitsstatus aktiviert hast, um deine Website im vorherigen Schritt mehrsprachig zu gestalten, und wenn du auf die Schaltfläche "Mehrsprachiger Status" links unten auf jeder Administratorseite klickst, erscheint ein Popup-Fenster, welches den Status der Mehrsprachigkeitsfunktion auf deiner Website anzeigt.

Natürlich sind diese Modals keine wirklichen Browser-Popup-Fenster - Benutzer deaktivieren diese häufig - sie verwenden stattdessen CSS und Javascript, um das Erscheinen von Pop-Ups zu imitieren. Joomla! verwendet derzeit das Framework [https://getbootstrap.com/docs/4.0/components/modal/ Bootstrap Modal]. Die HTML-Elemente, die das Modal einschließen, befinden sich bereits im HTML-Code der Seite, sind jedoch verborgen. Wenn Sie auf eine entsprechende Schaltfläche klicken (z. B. die Schaltfläche "Auswählen", um einen Beitrag wie im ersten Beispiel oben auszuwählen), führt der Javascript-Code nach einem Klick auf die Schaltfläche Folgendes aus:
* die versteckten HTML-Elemente des Modals werden sichtbar gemacht
* ein neues div-Element wird erstellt, welches das gesamte Browserfenster abdeckt; Dieser Hintergrund ist schwarz eingefärbt und hat teilweise Deckkraft, sodass das es so scheint, als wären die Elemente hinter dem Modal ausgegraut.
* in der CSS-Datei wird der Z-Index so definiert, dass das Modal über dem Hintergrund erscheint.

Wenn du das Modal schließt, indem du z. B. einen Artikel auswählst oder auf die Schaltfläche "Schließen" klickst, werden die HTML-Elemente des Modals erneut ausgeblendet, das Hintergrund-Div entfernt und jedes von dir ausgewählte Element durch Javascript an das entsprechende Feld im Hauptformular weitergeleitet.

Jedes Modal besteht aus drei Teilen:
* eine modale Kopfzeile oben, normalerweise mit dem Titel und der Schaltfläche X, um das Modal zu schließen,
* ein Modalkörper, in dem die Hauptinformation erscheint, und
* eine Modal-Fußzeile, mit Schaltflächen wie, je nach Kontext, Schließen, Speichern usw.

Allgemein gesagt, repräsentiert den Modalkörper ein Inlineframe-Element, welches eine eingebettete HTML-Seite innerhalb der Gesamtseite darstellt. HTTP-Anforderungen können erstellt werden, um anzuzeigende Daten im iframe Daten abzurufen, zu filtern, zu sortieren usw.

== Funktionsweise ==

Derzeit haben wir in unserer hallo Welt-Komponente die Möglichkeit, einen neuen Menüpunkt mit einem Menüelementtyp "Hallo Welt" zu erstellen, der eine einzige hallo Welt-Nachricht auf unserer Website anzeigt. Bei der Auswahl der anzuzeigenden Nachricht haben wir jedoch nur ein einfaches Listenfeld, und wir müssen die Liste der Oberpunkte nach unten scrollen, um das Geeignete auszuwählen.

In diesem Schritt ändern wir die Benutzeroberfläche so, dass dem Administrator bei Auswahl der hallo Welt-Nachricht für einen neuen Menüpunkt ein Modal mit allen Details der hallo Welt-Datensätze angezeigt wird, ähnlich dem, was angezeigt wird, wenn der Administrator auf Komponenten / Hallo Welt klickt. Auf diese Weise wird dem Administrator eine viel schönere Benutzeroberfläche mit Sortier-, Such- und Filterfunktionen angezeigt.

== Vorgehensweise ==

Die Definition dessen, was angezeigt wird, wenn ein Administrator einen Menüpunkt vom Typ Hallo Welt auswählt, ist in der XML-Datei der Seite Hallo Welt-Layoutdatei geregelt, z. B. Seite/Ansichten/hallowelt/tmpl/default.xml. Wir müssen die Felddefinition in dieser Datei zu einem benutzerdefinierten Feldtyp ändern, den wir modal_helloworld nennen.

Wir müssen Joomla! den Code für unser benutzerdefiniertes Feld zur Verfügung stellen, und wir stellen eine neue Datei bereit, um die HTML-Datei zu generieren, um unser benutzerdefiniertes Eingabefeld anzuzeigen.

Schließlich müssen wir die Anzeige der hallo Welt-Datensätze in unserem Modal überdenken. Wir werden eine Anzeige verwenden, die derjenigen ähnelt, die dem Administrator angezeigt wird, wenn er zu Komponenten / Hallo Welt navigiert, wir werden also unsere Hallo Welt-Ansicht wiederverwenden, erstellen jedoch eine neue Layoutdatei anstelle unserer derzeitigen Admindatei Ansichten/hallowelt/tmpl/default.php.

== Definition eines hallo welt Menüpunkts ==

Wir ändern das benutzerdefinierte Feld zur Auswahl des anzuzeigenden Hallo Welt-Datensatzes.

<span id="site/views/helloworld/tmpl/default.xml">
<tt>'''site/views/helloworld/tmpl/default.xml'''</tt>
<source lang="xml" highlight="13-14">
<?xml version="1.0" encoding="utf-8"?>
<metadata>
<layout title="COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE">
<message>COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_DESC</message>
</layout>
<fields
name="request"
addfieldpath="/administrator/components/com_helloworld/models/fields"
>
<fieldset name="request">
<field
name="id"
type="modal_helloworld"
required="true"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC"
/>
</fieldset>
</fields>
</metadata>
</source>
</span>

== Felddefinition ==

Die Felddefinition für unser neues benutzerdefiniertes Feld wird im Verzeichnis admin/models/fields gespeichert. Da der Feldtyp modal_helloworld (mit einem Unterstrich dazwischen) heißt, sucht Joomla! in einem /Modal-Unterverzeichnis nach einer Datei hallowelt.php. Daher ist unser neues benutzerdefiniertes Feld definiert in

<span id="admin/models/fields/modal/helloworld.php">
<tt>'''admin/models/fields/modal/helloworld.php'''</tt>
<source lang="php">
<?php

defined('JPATH_BASE') or die;

/**
* Supports a modal for selecting a helloworld record
*
*/
class JFormFieldModal_Helloworld extends JFormField
{
/**
* Method to get the html for the input field.
*
* @return string The field input html.
*/
protected function getInput()
{
// Load language
JFactory::getLanguage()->load('com_helloworld', JPATH_ADMINISTRATOR);

// $this->value is set if there's a default id specified in the xml file
$value = (int) $this->value > 0 ? (int) $this->value : '';

// $this->id will be jform_request_xxx where xxx is the name of the field in the xml file
$modalId = 'Helloworld_' . $this->id;

// Add the modal field script to the document head.
JHtml::_('jquery.framework');
JHtml::_('script', 'system/modal-fields.js', array('version' => 'auto', 'relative' => true));

// our callback function from the modal to the main window:
JFactory::getDocument()->addScriptDeclaration("
function jSelectHelloworld_" . $this->id . "(id, title, catid, object, url, language) {
window.processModalSelect('Helloworld', '" . $this->id . "', id, title, catid, object, url, language);
}
");

// if a default id is set, then get the corresponding greeting to display it
if ($value)
{
$db = JFactory::getDbo();
$query = $db->getQuery(true)
->select($db->quoteName('greeting'))
->from($db->quoteName('#__helloworld'))
->where($db->quoteName('id') . ' = ' . (int) $value);
$db->setQuery($query);

try
{
$title = $db->loadResult();
}
catch (RuntimeException $e)
{
JError::raiseWarning(500, $e->getMessage());
}
}

// display the default greeting or "Select" if no default specified
$title = empty($title) ? JText::_('COM_HELLOWORLD_MENUITEM_SELECT_HELLOWORLD') : htmlspecialchars($title, ENT_QUOTES, 'UTF-8');
$html = '<span class="input-append">';
$html .= '<input class="input-medium" id="' . $this->id . '_name" type="text" value="' . $title . '" disabled="disabled" size="35" />';

// html for the Select button
$html .= '<a'
. ' class="btn hasTooltip' . ($value ? ' hidden' : '') . '"'
. ' id="' . $this->id . '_select"'
. ' data-toggle="modal"'
. ' role="button"'
. ' href="#ModalSelect' . $modalId . '"'
. ' title="' . JHtml::tooltipText('COM_HELLOWORLD_MENUITEM_SELECT_BUTTON_TOOLTIP') . '">'
. '<span class="icon-file" aria-hidden="true"></span> ' . JText::_('JSELECT')
. '</a>';

// html for the Clear button
$html .= '<a'
. ' class="btn' . ($value ? '' : ' hidden') . '"'
. ' id="' . $this->id . '_clear"'
. ' href="#"'
. ' onclick="window.processModalParent(\'' . $this->id . '\'); return false;">'
. '<span class="icon-remove" aria-hidden="true"></span>' . JText::_('JCLEAR')
. '</a>';

$html .= '</span>';

// url for the iframe
$linkHelloworlds = 'index.php?option=com_helloworld&view=helloworlds&layout=modal&tmpl=component&' . JSession::getFormToken() . '=1';
$urlSelect = $linkHelloworlds . '&function=jSelectHelloworld_' . $this->id;

// title to go in the modal header
$modalTitle = JText::_('COM_HELLOWORLD_MENUITEM_SELECT_MODAL_TITLE');

// html to set up the modal iframe
$html .= JHtml::_(
'bootstrap.renderModal',
'ModalSelect' . $modalId,
array(
'title' => $modalTitle,
'url' => $urlSelect,
'height' => '400px',
'width' => '800px',
'bodyHeight' => '70',
'modalWidth' => '80',
'footer' => '<a role="button" class="btn" data-dismiss="modal" aria-hidden="true">' . JText::_('JLIB_HTML_BEHAVIOR_CLOSE') . '</a>',
)
);

// class='required' for client side validation.
$class = $this->required ? ' class="required modal-value"' : '';

// hidden input field to store the helloworld record id
$html .= '<input type="hidden" id="' . $this->id . '_id" ' . $class
. ' data-required="' . (int) $this->required . '" name="' . $this->name
. '" data-text="' . htmlspecialchars(JText::_('COM_HELLOWORLD_MENUITEM_SELECT_HELLOWORLD', true), ENT_COMPAT, 'UTF-8')
. '" value="' . $value . '" />';

return $html;
}

/**
* Method to get the html for the label field.
*
* @return string The field label html.
*/
protected function getLabel()
{
return str_replace($this->id, $this->id . '_id', parent::getLabel());
}
}
</source>
</span>

Wenn die Felddefinitionsklasse JFormField erweitert, erwartet Joomla!, dass zwei Methoden in der Klasse vorhanden sind: getInput(), das den HTML-Code für die Eingabefeldelemente zurückgeben soll, und GetLabel(), der den HTML-Code für das Label zurückgeben soll.

Es gibt mehrere Joomla!-Kernkomponenten, die Modalfelder verwenden, damit der Administrator Elemente auswählen kann, einschließlich com_content und com_contact. Diese Komponenten haben ähnliche Felddefinitionen, und die obige Datei ist eine zurechtgestutzte Version dieser Äquivalente, die lediglich diejenige Funktionalität unterstützt, die wir für diesen Lernschritt benötigen.

Es gibt eine Reihe von wichtigen HTML-Eingabeelementen, die von der getInput()-Methode oben zurückgegeben werden.
# Das Eingabefeld, in dem der aktuell ausgewählte Überbegriff angezeigt wird, oder der Text "Auswählen", wenn keiner ausgewählt wurde
# Die Auswahltaste - diese erscheint, wenn keine Begrüßung ausgewählt wurde. Beachte das Attribut data-toggle="modal", das darauf hinweist, dass durch Klicken auf diese Schaltfläche die Anzeige des Modals ausgelöst wird.
# Die Schaltfläche "Löschen" - sie erscheint, wenn ein Oberbegriff ausgewählt wurde. Mit einem Klick darauf wird eine Javascript-Funktion innerhalb des Codes system/modal-fields.js ausgeführt, die den ausgewählten Oberbegriff durch den Text "Auswahl" ersetzt, die Schaltfläche Auswahl sichtbar macht und die Schaltfläche Löschen ausblendet
# Die Modalelemente - diese werden über Abschnitte des Bootstrap-HTML- und JavaScript-Codes ausgegeben. Wenn der Modal erscheint, wird das Inline-Frame erstellt und durch ein HTTP-GET an die URL in <tt>$urlSelect</tt> aufgefüllt.
# Ein ausgeblendetes Feld, in dem die ID des ausgewählten hallo Welt-Datensatzes gespeichert und welches verwendet werden wird, um es in den HTTP POST Parametern weiterzugeben, wenn das Formular übertragen wird.

In unserem Fall heißt die Rückruffunktion <tt>jSelectHelloworld_jform_request_id</tt>, und das ist die Funktion, die aus dem Modal aufgerufen werden soll, um die ID und die Grußformel des ausgewählten hallo Welt-Datensatzes zu übergeben. Ist das bekannt, wird <tt>window.processModalSelect</tt> die Eingabefelder für Grußformel, die ID und die Sichtbarkeit der Schaltflächen Auswählen und Löschen festlegen.

Der Modal weiß, dass dies der Name der aufzurufenden Funktion ist, da er als <tt>&function=jSelectHelloworld_jform_request_id</tt> Parameter innerhalb der URL des Iframes übergeben wurde.

Beachte auch den Parameter <tt>&tmpl=component</tt> in der URL. Dieser bedeutet, dass die Datei component.php im Verzeichnis der installierten Vorlage verwendet werden wird, die eine HTML-Seite ohne Joomla!-Menüs usw., darstellt.

== Modalanzeige ==

Für die Modalanzeige verwenden wir dieselbe MVC wie die Admin "Hallo Welt" Funktionsweise. Weder der Controller noch das Modell müssen geändert werden, es gibt eine kleine Änderung an der Ansichtsdatei und es gibt eine neue Layoutdatei, die der Layoutdatei default.php ähnelt, sich aber in einigen wichtigen Punkten unterscheidet.

In der Ansichtsdatei werden weder die Symbolleistenschaltflächen noch die Seitenleiste angezeigt, um zwischen Nachrichten und Kategorien zu wählen (und einige alte Kommentare wurden ebenfalls entfernt).

<span id="admin/views/helloworlds/view.html.php">
<tt>admin/views/helloworlds/view.html.php</tt>
<source lang="php" highlight="50-55">
<?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 application
$app = JFactory::getApplication();
$context = "helloworld.list.admin.helloworld";
// Get data from the model
$this->items = $this->get('Items');
$this->pagination = $this->get('Pagination');
$this->state = $this->get('State');
$this->filterForm = $this->get('FilterForm');
$this->activeFilters = $this->get('ActiveFilters');

// What Access Permissions does this user have? What can (s)he do?
$this->canDo = JHelperContent::getActions('com_helloworld');

// Check for errors.
if (count($errors = $this->get('Errors')))
{
JError::raiseError(500, implode('<br />', $errors));

return false;
}

// Set the sidebar submenu and toolbar, but not on the modal window
if ($this->getLayout() !== 'modal')
{
HelloWorldHelper::addSubmenu('helloworlds');
$this->addToolBar();
}

// Display the template
parent::display($tpl);

// Set the document
$this->setDocument();
}

/**
* Add the page title and toolbar.
*
* @return void
*
* @since 1.6
*/
protected function addToolBar()
{
$title = JText::_('COM_HELLOWORLD_MANAGER_HELLOWORLDS');

if ($this->pagination->total)
{
$title .= "<span style='font-size: 0.5em; vertical-align: middle;'>(" . $this->pagination->total . ")</span>";
}

JToolBarHelper::title($title, 'helloworld');
if ($this->canDo->get('core.create'))
{
JToolBarHelper::addNew('helloworld.add', 'JTOOLBAR_NEW');
}
if ($this->canDo->get('core.edit'))
{
JToolBarHelper::editList('helloworld.edit', 'JTOOLBAR_EDIT');
}
if ($this->canDo->get('core.delete'))
{
JToolBarHelper::deleteList('', 'helloworlds.delete', 'JTOOLBAR_DELETE');
}
if ($this->canDo->get('core.admin'))
{
JToolBarHelper::divider();
JToolBarHelper::preferences('com_helloworld');
}
}
/**
* Method to set up the document properties
*
* @return void
*/
protected function setDocument()
{
$document = JFactory::getDocument();
$document->setTitle(JText::_('COM_HELLOWORLD_ADMINISTRATION'));
}
}
</source>
</span>

Unsere neue Modallayoutdatei:

<span id="admin/views/helloworlds/tmpl/modal.php">
<tt>admin/views/helloworlds/tmpl/modal.php</tt>
<source lang="php">
<?php
/**
* Layout file for the admin modal display of helloworld records
*
*/

defined('_JEXEC') or die('Restricted Access');

use Joomla\Registry\Registry;

JHtml::_('behavior.core');
JHtml::_('script', 'com_helloworld/admin-helloworlds-modal.js', array('version' => 'auto', 'relative' => true));

$listOrder = $this->escape($this->state->get('list.ordering'));
$listDirn = $this->escape($this->state->get('list.direction'));

$app = JFactory::getApplication();
$function = $app->input->getCmd('function', 'jSelectHelloworld');
$onclick = $this->escape($function);
?>
<div class="container-popup">

<form action="<?php echo JRoute::_('index.php?option=com_helloworld&view=helloworlds&layout=modal&tmpl=component&function=' . $function . '&' . JSession::getFormToken() . '=1'); ?>" method="post" name="adminForm" id="adminForm" class="form-inline">

<?php echo JLayoutHelper::render('joomla.searchtools.default', array('view' => $this)); ?>

<div class="clearfix"></div>

<table class="table table-striped table-hover">
<thead>
<tr>
<th width="3%"><?php echo JText::_('COM_HELLOWORLD_NUM'); ?></th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_HELLOWORLDS_NAME', 'greeting', $listDirn, $listOrder); ?>
</th>
<th width="15%">
<?php echo JText::_('COM_HELLOWORLD_HELLOWORLDS_POSITION'); ?>
</th>
<th width="15%">
<?php echo JText::_('COM_HELLOWORLD_HELLOWORLDS_IMAGE'); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_AUTHOR', 'author', $listDirn, $listOrder); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_LANGUAGE', 'language', $listDirn, $listOrder); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_CREATED_DATE', 'created', $listDirn, $listOrder); ?>
</th>
<th width="5%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_PUBLISHED', 'published', $listDirn, $listOrder); ?>
</th>
<th width="2%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_ID', 'id', $listDirn, $listOrder); ?>
</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) :
$row->image = new Registry;
$row->image->loadString($row->imageInfo);
if ($row->language && JLanguageMultilang::isEnabled())
{
$tag = strlen($row->language);
if ($tag == 5)
{
$lang = substr($row->language, 0, 2);
}
elseif ($tag == 6)
{
$lang = substr($row->language, 0, 3);
}
else {
$lang = '';
}
}
elseif (!JLanguageMultilang::isEnabled())
{
$lang = '';
}
?>
<tr>
<td><?php echo $this->pagination->getRowOffset($i); ?></td>
<td>
<?php
$link = 'index.php?option=com_helloworld&view=helloworld&id=' . $row->id;
$attribs = 'data-function="' . $this->escape($onclick) . '"'
. ' data-id="' . $row->id . '"'
. ' data-title="' . $this->escape(addslashes($row->greeting)) . '"'
. ' data-uri="' . $link . '"'
. ' data-language="' . $this->escape($lang) . '"'
;
?>
<a class="select-link" href="javascript:void(0)" <?php echo $attribs; ?>>
<?php echo $this->escape($row->greeting); ?>
</a>
<span class="small break-word">
<?php echo JText::sprintf('JGLOBAL_LIST_ALIAS', $this->escape($row->alias)); ?>
</span>
<div class="small">
<?php echo JText::_('JCATEGORY') . ': ' . $this->escape($row->category_title); ?>
</div>
</td>
<td align="center">
<?php echo "[" . $row->latitude . ", " . $row->longitude . "]"; ?>
</td>
<td align="center">
<?php
$caption = $row->image->get('caption') ? : '' ;
$src = JURI::root() . ($row->image->get('image') ? : '' );
$html = '<p class="hasTooltip" style="display: inline-block" data-html="true" data-toggle="tooltip" data-placement="right" title="<img width=\'100px\' height=\'100px\' src=\'%s\'>">%s</p>';
echo sprintf($html, $src, $caption); ?>
</td>
<td align="center">
<?php echo $row->author; ?>
</td>
<td align="center">
<?php echo JLayoutHelper::render('joomla.content.language', $row); ?>
</td>
<td align="center">
<?php echo substr($row->created, 0, 10); ?>
</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>
<input type="hidden" name="task" value=""/>
<input type="hidden" name="boxchecked" value="0"/>
<?php echo JHtml::_('form.token'); ?>
</form>
</div>
</source>
</span>

Beachte, dass es einige wichtige Unterschiede zu der Layoutdatei default.php gibt.

# Wir erhalten den <tt>function</tt> Parameter, der in die iframe-URL als Abfrageparameter eingebettet ist, und verwenden diesen im URL-Ziel des <tt><form></tt> Elements und im <tt>data-function</tt> Attribut eines jeden Grußformelwerts.
# Jedem Begrüßungswert sind mehrere andere Datenattribute zugeordnet; diese werden verwendet werden, um diese Information über den Funktionsaufruf jSelectHelloworld_jform_request_id an das Elternfenster weiterzugeben. Auch hat jede Begrüßung eine CSS-Klasse von "select-link".
# Wir müssen die Ziel-URL von <tt><form></tt> so einstellen, dass sie der URL des iframe entspricht. Dies liegt daran, dass das Formular immer dann, wenn der Administrator die Such-/Filter-Werkzeuge verwendet, eine HTTP-Anforderung an diese URL sendet, und wir müssen sicherstellen, dass es sich um dieselben Daten handelt, die angezeigt werden.

Außerdem wurden die Kontrollkästchen entfernt, da sie jetzt irrelevant sind.

Darüber hinaus benötigen wir eine kleine Javascript-Datei, die im Grunde einen onclick listener für jede Begrüßung (durch die Klasse "Select-Link" gekennzeichnet) festlegt und bei Auslösung die erforderliche Funktion aufruft.

<span id="media/js/admin-helloworlds-modal.js">
<tt>media/js/admin-helloworlds-modal.js</tt>
<source lang="javascript">
(function() {
"use strict";
/**
* Javascript to set up onclick listeners on the helloworld greetings
* When a greeting is clicked the listener invokes the function in the parent window
* which is given by the data-function attribute of the helloworld greeting html element
* In this way the identity of the helloworld record selected in the modal is passed to the field in the parent window
*/

document.addEventListener('DOMContentLoaded', function(){

var elements = document.querySelectorAll('.select-link');

for(var i = 0, l = elements.length; l>i; i++) {

elements[i].addEventListener('click', function (event) {
event.preventDefault();
var functionName = event.target.getAttribute('data-function');
window.parent[functionName](event.target.getAttribute('data-id'), event.target.getAttribute('data-title'), null, null, event.target.getAttribute('data-uri'), event.target.getAttribute('data-language'), null);
})
}
});
})();

</source>
</span>

== Aktualisierte Sprachzeichenfolgen ==

<span id="admin/language/en-GB/en-GB.com_helloworld.ini">
<tt>admin/language/en-GB/en-GB.com_helloworld.ini</tt>
<source lang="text" highlight="86-89">
; Joomla! Project
; Copyright (C) 2005 - 2018 Open Source Matters. All rights reserved.
; License GNU General Public License version 2 or later; see LICENSE.txt, see LICENSE.php
; Note : All ini files need to be saved as UTF-8

COM_HELLOWORLD_ADMINISTRATION="HelloWorld - Administration"
COM_HELLOWORLD_ADMINISTRATION_CATEGORIES="HelloWorld - Categories"
COM_HELLOWORLD_NUM="#"
COM_HELLOWORLD_HELLOWORLDS_FILTER="Filters"
COM_HELLOWORLD_AUTHOR="Author"
COM_HELLOWORLD_LANGUAGE="Language"
COM_HELLOWORLD_CREATED_DATE="Created"
COM_HELLOWORLD_PUBLISHED="Published"
COM_HELLOWORLD_HELLOWORLDS_NAME="Name"
COM_HELLOWORLD_HELLOWORLDS_POSITION="Position"
COM_HELLOWORLD_HELLOWORLDS_IMAGE="Image"
COM_HELLOWORLD_ID="Id"

COM_HELLOWORLD_HELLOWORLD_CREATING="HelloWorld - Creating"
COM_HELLOWORLD_HELLOWORLD_DETAILS="Details"
COM_HELLOWORLD_HELLOWORLD_EDITING="HelloWorld - Editing"
COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE="Some values are unacceptable"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_DESC="The category the messages belongs to"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_LABEL="Category"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC="This message will be displayed"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL="Message"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL="Show category"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC="If set to Show, the title of the message’s category will show."
COM_HELLOWORLD_HELLOWORLD_FIELD_LATITUDE_LABEL="Latitude"
COM_HELLOWORLD_HELLOWORLD_FIELD_LATITUDE_DESC="Enter the position latitude, between -90 and +90 degrees"
COM_HELLOWORLD_HELLOWORLD_FIELD_LONGITUDE_LABEL="Longitude"
COM_HELLOWORLD_HELLOWORLD_FIELD_LONGITUDE_DESC="Enter the position longitude, between -180 and +180 degrees"
COM_HELLOWORLD_HELLOWORLD_FIELD_LANGUAGE_DESC="Select the appropriate language"
COM_HELLOWORLD_IMAGE_FIELDS="Image details"
COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_LABEL="Select image"
COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_DESC="Select an image from the library, or upload a new one"
COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_LABEL="Alt text"
COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_DESC="Alternative text (if image cannot be displayed)"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_LABEL="Caption"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_DESC="Provide a caption for the image"
COM_HELLOWORLD_HELLOWORLD_HEADING_GREETING="Greeting"
COM_HELLOWORLD_HELLOWORLD_HEADING_ID="Id"
COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT="HelloWorld manager: Edit Message"
COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW="HelloWorld manager: New Message"
COM_HELLOWORLD_MANAGER_HELLOWORLDS="HelloWorld manager"
COM_HELLOWORLD_EDIT_HELLOWORLD="Edit message"
COM_HELLOWORLD_N_ITEMS_DELETED_1="One message deleted"
COM_HELLOWORLD_N_ITEMS_DELETED_MORE="%d messages deleted"
COM_HELLOWORLD_N_ITEMS_PUBLISHED="%d message(s) published"
COM_HELLOWORLD_N_ITEMS_UNPUBLISHED="%d message(s) unpublished"
COM_HELLOWORLD_HELLOWORLD_GREETING_LABEL="Greeting"
COM_HELLOWORLD_HELLOWORLD_GREETING_DESC="Add Hello World Greeting"
COM_HELLOWORLD_SUBMENU_MESSAGES="Messages"
COM_HELLOWORLD_SUBMENU_CATEGORIES="Categories"
COM_HELLOWORLD_CONFIGURATION="HelloWorld Configuration"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_LABEL="Messages settings"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_DESC="Settings that will be applied to all messages by default"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_LABEL="Captcha"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_DESC="Select Captcha to use on front end form"
COM_HELLOWORLD_HELLOWORLD_FIELD_USER_TO_EMAIL_LABEL="User to email"
COM_HELLOWORLD_HELLOWORLD_FIELD_USER_TO_EMAIL_DESC="Select user to email when a new message is entered on front end"
COM_HELLOWORLD_FIELDSET_RULES="Message Permissions"
COM_HELLOWORLD_FIELD_RULES_LABEL="Permissions"
COM_HELLOWORLD_ACCESS_DELETE_DESC="Is this group allowed to edit this message?"
COM_HELLOWORLD_ACCESS_DELETE_DESC="Is this group allowed to delete this message?"
COM_HELLOWORLD_TAB_NEW_MESSAGE="New Message"
COM_HELLOWORLD_TAB_EDIT_MESSAGE="Message Details"
COM_HELLOWORLD_TAB_PARAMS="Parameters"
COM_HELLOWORLD_TAB_PERMISSIONS="Permissions"
COM_HELLOWORLD_TAB_IMAGE="Image"
COM_HELLOWORLD_LEGEND_DETAILS="Message Details"
COM_HELLOWORLD_LEGEND_PARAMS="Message Parameters"
COM_HELLOWORLD_LEGEND_PERMISSIONS="Message Permissions"
COM_HELLOWORLD_LEGEND_IMAGE="Image info"
; Column ordering in the Helloworlds view
COM_HELLOWORLD_ORDERING_ASC="Greeting ascending"
COM_HELLOWORLD_ORDERING_DESC="Greeting descending"
COM_HELLOWORLD_AUTHOR_ASC="Author ascending"
COM_HELLOWORLD_AUTHOR_DESC="Author descending"
COM_HELLOWORLD_CREATED_ASC="Creation date ascending"
COM_HELLOWORLD_CREATED_DESC="Creation date descending"
COM_HELLOWORLD_PUBLISHED_ASC="Unpublished first"
COM_HELLOWORLD_PUBLISHED_DESC="Published first"
COM_HELLOWORLD_LANGUAGE_ASC="Language ascending"
COM_HELLOWORLD_LANGUAGE_DESC="Language descending"
; Helloworld menuitem - selecting a greeting via modal
COM_HELLOWORLD_MENUITEM_SELECT_MODAL_TITLE="Select greeting"
COM_HELLOWORLD_MENUITEM_SELECT_HELLOWORLD="Select"
COM_HELLOWORLD_MENUITEM_SELECT_BUTTON_TOOLTIP="Select a helloworld greeting"
</source>
</span>

== Die Komponente konfektionieren ==
Der Inhalt deines Codeverzeichnisses. Jeder folgende Dateilink führt dich zu dem Schritt im Tutorial, der die aktuellste Version dieser Quellcodedatei aufweist.

* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#helloworld.xml|helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an install-uninstall-update script file#script.php|script.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/router.php|site/router.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding AJAX#site/controller.php|site/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/controllers/helloworld.php|site/controllers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Map#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding AJAX#site/views/helloworld/view.json.php|site/views/helloworld/view.json.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding AJAX#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/form/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/views/form/view.html.php|site/views/form/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/form/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/views/form/tmpl/edit.php|site/views/form/tmpl/edit.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#site/views/form/tmpl/edit.xml|site/views/form/tmpl/edit.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/category/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/views/category/view.html.php|site/views/category/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/category/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/views/category/tmpl/default.php|site/views/category/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#site/views/category/tmpl/default.xml|site/views/category/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/models/helloworld.php|site/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#site/models/form.php|site/models/form.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/models/category.php|site/models/category.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/models/forms/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/models/forms/add-form.xml|site/models/forms/add-form.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_alias#site/models/forms/filter_category.xml|site/models/forms/filter_category.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Using the language filter facility#site/language/en-GB/en-GB.com_helloworld.ini|site/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/helpers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/helpers/route.php|site/helpers/route.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#site/helpers/category.php|site/helpers/category.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/helloworld.php|admin/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/config.xml|admin/config.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Basic_backend#admin/controller.php|admin/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/access.xml|admin/access.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/helpers/helloworld.php|admin/helpers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/helpers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/sql/install.mysql.utf8.sql|admin/sql/install.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/uninstall.mysql.utf8.sql|admin/sql/uninstall.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/install.mysql.utf8.sql|admin/sql/updates/mysql/0.0.6.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/sql/updates/mysql/0.0.12.sql|admin/sql/updates/mysql/0.0.12.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/sql/updates/mysql/0.0.13.sql|admin/sql/updates/mysql/0.0.13.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/sql/updates/mysql/0.0.14.sql|admin/sql/updates/mysql/0.0.14.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#admin/sql/updates/mysql/0.0.16.sql|admin/sql/updates/mysql/0.0.16.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/sql/updates/mysql/0.0.17.sql|admin/sql/updates/mysql/0.0.17.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Map#admin/sql/updates/mysql/0.0.18.sql|admin/sql/updates/mysql/0.0.18.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/sql/updates/mysql/0.0.20.sql|admin/sql/updates/mysql/0.0.20.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/sql/updates/mysql/0.0.21.sql|admin/sql/updates/mysql/0.0.21.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/fields/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/models/fields/helloworld.php|admin/models/fields/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/fields/modal/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#admin/models/fields/modal/helloworld.php|admin/models/fields/modal/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/models/helloworlds.php|admin/models/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/models/helloworld.php|admin/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/models/forms/filter_helloworlds.xml|admin/models/forms/filter_helloworlds.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/forms/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/models/forms/helloworld.js|admin/models/forms/helloworld.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/models/forms/helloworld.xml|admin/models/forms/helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#admin/models/rules/greeting.php|admin/models/rules/greeting.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/rules/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/controllers/helloworld.php|admin/controllers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_backend_actions#admin/controllers/helloworlds.php|admin/controllers/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/controllers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/views/helloworld/view.html.php|admin/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/views/helloworld/tmpl/edit.php|admin/views/helloworld/tmpl/edit.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/views/helloworld/submitbutton.js|admin/views/helloworld/submitbutton.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#admin/views/helloworlds/view.html.php|admin/views/helloworlds/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using the language filter facility#admin/views/helloworlds/tmpl/default.php|admin/views/helloworlds/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#admin/views/helloworlds/tmpl/modal.php|admin/views/helloworlds/tmpl/modal.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/tables/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_alias#admin/tables/helloworld.php|admin/tables/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding a Modal#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.ini|admin/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding an alias#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.sys.ini|admin/language/en-GB/en-GB.com_helloworld.sys.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/images/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-16x16.png]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-48x48.png]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/js/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an alias#media/js/openstreetmap.js|media/js/openstreetmap.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Modal#media/js/admin-helloworlds-modal.js|media/js/admin-helloworlds-modal.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/css/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding a Map#index.html|media/css/openstreetmap.css]]''

<span id="helloworld.xml">
<tt>helloworld.xml</tt>
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.0" method="upgrade">

<name>COM_HELLOWORLD</name>

<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>

<version>0.0.22</version>

<description>COM_HELLOWORLD_DESCRIPTION</description>


<scriptfile>script.php</scriptfile>

<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>
<filename>router.php</filename>
<folder>controllers</folder>
<folder>views</folder>
<folder>models</folder>
<folder>helpers</folder>
</files>

<languages folder="site/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
<language tag="fr-FR">fr-FR/fr-FR.com_helloworld.ini</language>
</languages>

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

<administration>

<menu link='index.php?option=com_helloworld' img="../media/com_helloworld/images/tux-16x16.png">COM_HELLOWORLD_MENU</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>config.xml</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<filename>access.xml</filename>

<folder>sql</folder>

<folder>tables</folder>

<folder>models</folder>

<folder>views</folder>

<folder>controllers</folder>

<folder>helpers</folder>
</files>
<languages folder="admin/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
<language tag="en-GB">en-GB/en-GB.com_helloworld.sys.ini</language>
<language tag="fr-FR">fr-FR/fr-FR.com_helloworld.ini</language>
<language tag="fr-FR">fr-FR/fr-FR.com_helloworld.sys.ini</language>
</languages>
</administration>

</extension>
</source>
</span>

== Mitwirkende ==
*[[User:Robbiej|Robbie Jackson]]

<div class="row">
<div class="large-6 columns">{{Basic button|
S:MyLanguage/J3.x:Developing_an_MVC_Component/Using the language filter facility|Voheriges: Verwendung der Sprachfiltereinrichtung|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding Associations|Nächstes: Assoziationen hinzufügen|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
[[Category:Joomla! 3.x{{#translation:}}]]
[[Category:Joomla! 3.0{{#translation:}}]]
[[Category:Joomla! 3.1{{#translation:}}]]
[[Category:Joomla! 3.2{{#translation:}}]]
[[Category:Joomla! 3.3{{#translation:}}]]
[[Category:Joomla! 3.4{{#translation:}}]]
[[Category:Beginner Development{{#translation:}}]]
[[Category:Component Development{{#translation:}}]]
[[Category:Tutorials{{#translation:}}]]
[[Category:Tutorials in a Series{{#translation:}}]]
</noinclude>

Translations:J3.x:Developing an MVC Component/Adding a Modal/46/de

2020-02-20T09:06:53Z

Es ka: fixed formatting

# Wir erhalten den <tt>function</tt> Parameter, der in die iframe-URL als Abfrageparameter eingebettet ist, und verwenden diesen im URL-Ziel des <tt><form></tt> Elements und im <tt>data-function</tt> Attribut eines jeden Grußformelwerts.

JDOC:Documentation Translators

2020-02-19T10:45:15Z

Es ka: /* de - Deutsch - German */ added user

[[File:JDOC translation icon.png|right]]
Here, people '''translating''' {{SITENAME}} can sign up as a translator. Please be sure to read the required reading list below.

After you add your username to the list below under the appropriate language heading, a [[JDOC:Translation Administrators|Translation Administrator]] will assign your username translator permissions. After your username is added as a translator you can start translating! Please be on the look out for a [[Template:Translator welcome|welcome message]] with more information posted to your user talk page.{{-}}

==Required Reading==
* Getting started, read [[JDOC:Page Translation Quickstart Guide|Page Translation Quickstart Guide]]
* Detailed explanation of translating, [[JDOC:Page Translation Explained|Page Translation Explained]].
* Our [[JDOC:Language policy|Language policy]]
* [[JDOC:Translator Tips|Translator Tips]]
* [[Joomla:JDOC%27s_Translation_Guidelines|Translation Guidelines]]
* Having an [[JDOC:Translation Questions|issue or need help]]?

{{tip|text=Dear translators! Please [[Special:TranslatorSignup|register for translator notifications about your language]]. You are placed on a list to receive notices about new/updated pages that need translation.|title=A Tip for Translators}}

===Add Your Language===
If your language isn't listed below, please add it using the format:

<code><lang code> - Localised language name - English language name </code>

Use the syntax, <code><nowiki>* {{User|YourUsername}}</nowiki> - requested</code>

When a Translation Administrator adds you as a translator, they will remove the "- requested" from your username.

==Current Translations Teams==

Documentation language codes are different from Joomla! language codes, they are ISO 639-1 2 letter code. A small quantity of 4 letter language codes are used as an exception, but these language codes are all lowercase.

=== ar - عربي - arabe ===
* {{User|ghilo}}
* {{User|HawraMilani}}
* {{User|hossen}}
* {{User|ahmadm42}}

=== af - Afrikaans ===
*{{User|JoeSA}}
*{{User|Llewellyn}}

=== be - Беларуская - Belarusian ===
* {{User|Nikolice}}

=== bg - Български - Bulgarian ===
* {{User|bdimov}}
* {{User|Mastwd}}

=== bn - বাংলা - Bengali ===
* {{User|ashiks}}
* {{User|shamsbd71}}
* {{User|theanamhossain}}
* {{User|Azadulkabir455}}

=== ca - Català - Catalan ===
* {{User|el_libre}}

=== cs - Čeština - Czech ===
* {{User|fredericco-cz}}
* {{User|Bart}}
* {{User|n3tcz}}
* {{User|svatas}}

=== da - Dansk - Danish ===
* {{User|ot2sen}}
* {{User|rbuelund}}
* {{User|BBRA}}

=== de - Deutsch - German ===
* {{User|Astridx}}
* {{User|Assmann}}
* {{User|Alexander-metzler}}
* {{User|Balzercomp}}
* {{User|Batmin}}
* {{User|bbkSecond}}
* {{User|Blancanieve}}
* {{User|ceus1984}}
* {{User|Chmst}}
* {{User|chrishoefliger}}
* {{User|Dimkk}}
* {{User|es_ka}}
* {{User|FancyFranci}}
* {{User|Farrell}}
* {{User|Florian}}
* {{User|FLin1}}
* {{User|FrankyD}}
* {{User|Franz.wohlkoenig}}
* {{User|fruppel}}
* {{User|goethe}}
* {{User|gorgonz}}
* {{User|Hleithner}}
* {{User|Indigo66}}
* {{User|Isarbella}}
* {{User|jehacgn}}
* {{User|JDocDummy}}
* {{User|joomla-agency}}
* {{User|Joomti}}
* {{User|Ka3media}}
* {{User|King_Louis_1}}
* {{User|Knig.Markus}}
* {{User|Kolvar}}
* {{User|Kurztipp}}
* {{User|LadySolveig}}
* {{User|m-b-o}}
* {{User|Maggus}}
* {{User|Max123kl}}
* {{User|michaelmyk}}
* {{User|Nathan.k}}
* {{User|oliverhh}}
* {{User|Paterna}}
* {{User|Pc-doppler}}
* {{User|Pete71}}
* {{User|phillopp}}
* {{User|plocher}}
* {{User|Prof.Logout}}
* {{User|quiltgabi}}
* {{User|RMajewski}}
* {{User|Schmidie64}}
* {{User|SeigetsuShoen}}
* {{User|Sieger66}}
* {{User|Sisko1990}}
* {{User|Spannama}}
* {{User|Stefanie}}
* {{User|tfecha}}
* {{User|Tkahl}}
* {{User|UCFnet002}}
* {{User|Usimon}}
* {{User|Webberry}}
* {{User|Yvesh}}
* {{User|zero24}}
* {{User|Xadomir}}
* {{User|waldiwhz}}
* {{User|Widmann}}
* {{User|Zeroweb1}}
* {{User|Zeroweb2}}
* {{User|RobertMittl}}
* {{User|Uta}}

=== el - Ελληνικά - Greek ===
* {{User|Aris_Ntatsis}}
* {{User|Tonia_Chan}}
* {{User|Alphapi}}
* {{User|Alcaeusd}}
* {{User|TaDrik}}
* {{User|SiteworksGr}}
* {{User|pnkr}}
* {{User|Gfakas}}
* {{User|Stekarag}}
* {{User|Proudpixel}}
* {{User|Tropos}}
* {{User|ARTIFIEDWEB}}
* {{User|Fotis}}

=== es - Español - Spanish ===
* {{User|Abulafia}}
* {{User|Andrea Gentil}}
* {{user|Antoniofmunoz}}
* {{User|BNovoa.S}}
* {{User|brucevalle}}
* {{User|carcam}}
* {{User|cristobal.vio}}
* {{User|Crsanchez}}
* {{User|danielperaza}}
* {{User|duoduo}}
* {{User|filisfutsarov}}
* {{User|framon}}
* {{User|Irene.lopez}}
* {{User|isidrobaq}}
* {{User|ivanramosnet}}
* {{User|Javiparati}}
* {{User|Jcollver}}
* {{User|Jolfig}}
* {{User|Koa}}
* {{User|Leo_Soto}}
* {{User|netandsoftware}}
* {{User|pdavila2709}}
* {{User|NunoLopes}}
* {{User|pfvidal}}
* {{User|shaz}}
* {{User|Urielmx}}
* {{User|VictorYork87}}
* {{User|viena}}
* {{User|Willin}}

=== et - Eesti - Estonian ===
* {{User|Eraser}}

=== fa - فارسی - Persian ===
* {{User|azolfagharj}}
* {{User|Grand}}
* {{User|Heydari}}
* {{User|Joomlafarsi}}
* {{User|Levelup}}
* {{User|mhehm}}

=== fr - Français - French ===
* {{User|alatak}}
* {{User|david613}}
* {{User|Cavo789}}
* {{User|edelouche}}
* {{User|Erix}}
* {{User|Garstud}}
* {{User|Lorangerart}}
* {{User|MaximeK7}}
* {{User|Opware2000}}
* {{User|Perete}}
* {{User|Remi1945}}
* {{User|Sandra97}}
* {{User|Shim-sao}}
* {{User|Twister65}}
* {{User|wisgar}}
* {{User|smilecollector}}

=== ga - Gaeilge - Irish ===
* {{User|rvbgnu}}

=== he - עברית - Hebrew ===
* {{User|ydl}}
* {{User|shirdesign}}

=== hi - हिंदी - Hindi ===
* {{User|AlamM}}
* {{User|Rana}}
* {{User|Syhussaini}}
* {{User|Shivamrajput}}
* {{User|ankitify}}

=== hr - Hrvatski - Croatian ===
* {{User|limoo}}

=== hu - Magyar - Hungarian ===
* {{User|Balazs}}
* {{User|webgobe}}

=== hy - Հայերեն - Armenian ===
* {{User|Aaleksanyants}}

=== id - Bahasa Indonesia - Indonesian ===
* {{User|dw1Rianto}}
* {{User|Micokelana}}
* {{User|sikumbang}}

=== it - Italiano - Italian ===
* {{User|alexred}}
* {{User|aleorco}}
* {{User|alikon}}
* {{User|Andreacarriero}}
* {{User|CinziaDesign}}
* {{User|donato}}
* {{User|ino}}
* {{User|Ladyj}}
* {{User|Luca.marzo}}
* {{User|marioluciani}}
* {{User|moqui}}
* {{User|nemo_bis}} (occasionally)
* {{User|Paolo Alberti}}
* {{User|Fabio Caracciolo}}
* {{User|robertolongo}}
* {{User|ste}}
* {{User|Ing Pulizzi}}
* {{User|Davidemessia}}
* {{User|NioBee}}
* {{User|Aurora}}
* {{User|Cristina Martorana}}
* {{User|Razzo}}

=== ja - 日本語 - Japanese ===
* {{User|Koji Hijikuro}}
* {{User|Nori}}
* {{User|Richell}}
* {{User|Yama}}
* {{User|Yui}}

=== lg - Luganda ===
*{{User|Bongomindaniel}}

=== nl - Nederlands - Dutch ===
* {{User|HildaAbbing}}
* {{User|AboutTime}}
* {{User|Alex0703}}
* {{User|Annemiek}}
* {{User|Arkomat}}
* {{User|BCWebdesign}}
* {{User|crommie}}
* {{User|Grubosoft}}
* {{User|fcschippers}}
* {{User|HermanPeeren}}
* {{User|Hvdmeer}}
* {{User|janvankuijk}}
* {{User|John Flour}}
* {{User|JorSanders}}
* {{User|Josien}}
* {{User|Lara}}
* {{User|LtB}}
* {{User|Lianne}}
* {{User|klatte88}}
* {{User|ManuAmpe}}
* {{User|Marcelk}}
* {{User|marionnijhuis}}
* {{User|Marnix}}
* {{User|MartijnM}}
* {{User|Meta}}
* {{User|metdick}}
* {{User|Mtb}}
* {{User|n9iels}}
* {{User|Nemphias}}
* {{User|Nico-van-Leeuwen}}
* {{User|Onderzoekspraktijk}}
* {{User|rachel73}}
* {{User|Renem}}
* {{User|Ries}}
* {{User|Rineke}}
* {{User|Schrijvers123}}
* {{User|slibbe}}
* {{User|Sloekers}}
* {{User|Stitch123}}
* {{User|Vertaalbirdy}}
* {{User|webmiep}}
* {{User|Webcase}}
* {{User|webcatsolutions}}
* {{User|willoweb}}
* {{User|wimstrik}}

=== pl - Polski - Polish ===
* {{User|Derek}}
* {{User|justyna}}
* {{User|MiloW}}
* {{User|Zwiastun}}

=== pt - Português (Portugal) - Portuguese (Portugal) ===
* {{User|Djesus}}
* {{User|Horus_68}}
* {{User|Lampreia Lopes}}
* {{User|Mansil}}
* {{User|Nunof}}
* {{User|NunoLopes}}
* {{User|Ricardo.fusco}}

=== pt-br - Português Brasil - Brazilian Portuguese ===
* {{User|Airton}}
* {{User|alangustavo}}
* {{User|AleMorettiSan}}
* {{User|Anabarcellos}}
* {{User|Ariadnepinheiro}}
* {{User|Belisards}}
* {{User|Dagoberto}}
* {{User|DiLeu}}
* {{User|Filipetorres}}
* {{User|Gleisonsoares}}
* {{User|Helvecio}}
* {{User|Henrydouglas}}
* {{User|Jeann Wilson}}
* {{User|Juliano.freitas}}
* {{User|Murilotimo}}
* {{User|VitorAdonai}}
* {{User|Vizetti}}
* {{User|Welkson Ramos}}

=== ro - Română - Romanian ===
* {{User|andreeastefan}}
* {{User|isac}}
* {{User|Dudi161}}

=== ru - Русский - Russian ===
* {{User|AlexSmirnov}}
* {{User|Antonio3}}
* {{User|b2z}}
* {{User|cadko}}
* {{User|Cronolio}}
* {{User|Dosfanat}}
* {{User|Dzandut}}
* {{User|Igor}}
* {{User|Kanta}}
* {{User|Leo240}}
* {{User|Nikitm}}
* {{User|Nikolice}}
* {{User|Serg SSN}}
* {{User|Vyatka}}
* {{User|Yambergaa}}

=== si - සිංහල - Sinhala ===
* {{User|Yasirunilan}}
* {{User|Supun}}

=== sk - Slovenčina - Slovak ===
* {{User|adambako}}

=== sw - Kiswahili ==
*

=== yu - Srpski (Latin) - Serbian (Latin) ===
* {{User|novii}}

=== sr - Српски (Ћирилица) - Serbian (Cyrillic) ===
* {{User|novii}}

=== sv - Svenska - Swedish ===
* {{User|Propellerhuvud}}
* {{User|Sgagner}}

=== sw - Kiswahili - Swahili ===
* {{User|Ayeko}}

=== th - ไทย - Thai ===
* {{User|Supachai_chai}}
* {{User|Mrs.siam}}
* {{User|Ariesanywhere}}

=== tr - Türkçe - Turkish ===
* {{User|Ugur}}
* {{User|Umitkenan}}

=== ukr - Українська - Ukrainian ===
* {{User|Olesya6968ak}}
* {{User|sera527}}
* {{User|trv}}

=== ur - ur-PK - اردو - Urdu Pakistan ===
* {{User|hoornayyer}}

=== vec - Veneto - Vèneto ===
* {{User|ino}}

=== vi - Tiếng Việt - Vietnamese ===
* {{User|huyhoa}}

=== zh - 中文 - Chinese ===
* {{User|asika32764}}
* {{User|eyesofkids}}
* {{User|Guozhanfeng}}
* {{User|KellyXYM}}
* {{User|lai32290}}
* {{User|Mori0725ken}}
* {{User|myskies}}
* {{User|Wulijun01234}}
* {{User|Zace}}
* {{User|Zhang19min88}}
* {{User|Zhous98}}

=== zh-tw - 繁體中文 - Traditional Chinese ===
* {{User|Yuhoward}}

==Translation Administrators==

The responsibilities of a Translation Administrator will require slightly more attention to the documents for translation. Translation Administrators should feel comfortable with using wiki markup, made hundreds of contributions to their specific language and assisted others in translation of docs. Administrators will need to check the documentation every few days and perform any required tasks. These tasks include re-marking pages in en-GB with edit changes, tracking language units which need translation and welcoming new translators. Ideally, we should have at least one Translation Administrator who will not be tied to any specific language and when the time comes, one Translation Administrator for active language teams.

===Current Volunteer Translation Administrators===
{{:Special:ListUsers/translationadmins}}

==Common Language Codes==
<div class="small-4 columns"> afr - Afrikaans - Afrikaans
</div><div class="small-4 columns"> ar - عربي - Arabic
</div><div class="small-4 columns"> be - Беларуская - Belarusian
</div><div class="small-4 columns"> bg - Български - Bulgarian
</div><div class="small-4 columns"> bn - বাংলা - Bengali
</div><div class="small-4 columns"> bo - བོད་ཡིག - tibetan
</div><div class="small-4 columns"> ca - Català - Catalan
</div><div class="small-4 columns"> ce - Nohçi - Chechen
</div><div class="small-4 columns"> da - Dansk - Danish
</div><div class="small-4 columns"> de - Deutsch - German
</div><div class="small-4 columns"> es - Español - Spanish
</div><div class="small-4 columns"> fa - فارسی - Persian
</div><div class="small-4 columns"> fi - Suomi - Finnish
</div><div class="small-4 columns"> fr - Français - French
</div><div class="small-4 columns"> hu - Magyar - Hungarian
</div><div class="small-4 columns"> hy - Հայերեն - Armenian
</div><div class="small-4 columns"> id - Bahasa Indonesia - Indonesian
</div><div class="small-4 columns"> is - Íslenska - Icelandic
</div><div class="small-4 columns"> it - Italiano - Italian
</div><div class="small-4 columns"> ja - 日本語 - Japanese
</div><div class="small-4 columns"> ko - 한국어 - Korean
</div><div class="small-4 columns"> lb - Lëtzebuergesch - Luxembourgish
</div><div class="small-4 columns"> min - Baso Minangkabau - Minang
</div><div class="small-4 columns"> ml - liviox alvax - Malayalam
</div><div class="small-4 columns"> mr - मराठी - Marathi
</div><div class="small-4 columns"> ms - Bahasa Melayu - Malay
</div><div class="small-4 columns"> nl - Nederlands - Dutch
</div><div class="small-4 columns"> pl - Polski - Polish
</div><div class="small-4 columns"> pt - Português - Portuguese
</div><div class="small-4 columns"> pt-br - Português do Brasil - Brazilian Portuguese
</div><div class="small-4 columns"> ro - Română - Romanian
</div><div class="small-4 columns"> ru - Русский - Russian
</div><div class="small-4 columns"> sl - Slovenščina - Slovenianjtökók
</div><div class="small-4 columns"> sq - Shqip - Albanian
</div><div class="small-4 columns"> sv - Svenska - Swedish
</div><div class="small-4 columns"> sw - Kiswahili - Swahili
</div><div class="small-4 columns"> ta - தமிழ் - Tamil
</div><div class="small-4 columns"> th - ไทย - Thai
</div><div class="small-4 columns"> tr - Türkçe - Turkish
</div><div class="small-4 columns"> vi - Tiếng Việt - Vietnamese
</div><div class="small-4 columns"> zh - 中文 - Chinese
</div><div class="small-4 columns"> zh-tw - 繁體中文 - Traditional Chinese
</div>

<noinclude>
[[Category:Documentation Wiki Policies and Guidelines]]
[[Category:Documentation Translation]]
</noinclude>

J3.x:Developing an MVC Component/Adding an Image

2020-02-14T16:27:58Z

Es ka: Bugfix: typo in admin/views/helloworlds/tmpl/default.php

<noinclude><languages /></noinclude>
{{:J3.1:Developing an MVC Component/<translate>
en</translate>}}

<translate>
This tutorial is part of the [[S:MyLanguage/J3.x:Developing_an_MVC_Component/Introduction|Developing a MVC Component for Joomla! 3.x]] tutorial. You are encouraged to read the previous parts of the tutorial before reading this.


In this step we add an image to each Helloworld greeting, and describe how to allow the administrator to select an image from the media library, and a general user to upload an image via a front-end form.


There are 2 videos available which complement this step, covering [https://youtu.be/PnRIMz4kC_o Admin functionality and PHP file handling] and [https://youtu.be/NYwa3csb7IM Controller code and related topics].
</translate>

* <translate> Admin functionality and PHP file handling</translate>
{{#widget:YouTube|id=PnRIMz4kC_o}}
* <translate> Controller code and related topics</translate>
{{#widget:YouTube|id=NYwa3csb7IM}}

<translate>
== Functionality == 
</translate>
<translate> The main functionality which we'll build in this step will be</translate>
<translate>
* Back end
** allow the administrator to select an image to be associated with each helloworld greeting
** display details of the image on the administrator's list of helloworld greetings
* Front end
** display the image associated with the helloworld greeting
** allow a user to upload an image when creating a new helloworld greeting</translate>

<translate>
== Approach == 
</translate>
<translate> We'll extend our Helloworld database record to include the filename of the image file within our Joomla instance (by default, stored within the images folder). Together with the image link we'll also store a caption and alt text, as these are what are used in an HTML img tag. We'll create one database field to store all three items in JSON-encoded format (as we did for the params field in [[S:MyLanguage/J3.x:Developing an MVC Component/Adding configuration|Adding configuration]]). This means that we'll need to sort out converting between the database format (JSON-encoded) and how the data is presented in a form (via an array).</translate>

<translate> In the back end we'll need to change the helloworld edit form, both its xml definition and the layout file, to include capturing the image details, and we'll need to satisfy ourselves that the image information is extracted in the model, in order to prefill the data in the edit form. We'll need to make sure that the save of the edited / new record handles the image details as well.</translate>
<translate>

We'll also change the "helloworlds" list layout to include the new image data, and we'll need to change the model to including selecting the image data from the database.</translate>
<translate>

On the front end we have the view which displays the helloworld message – we'll ensure our layout file includes the image as well, and we'll need to get the additional information from the model. We also have the front end form developed in the previous step, and we'll change this to allow a user to upload an image. This will entail work in the associated controller handling the POST, in order to deal with uploading the image file.</translate>

<translate>
== Updating the Database == 
</translate>
<translate> Add a field called 'image' to our database record, which will store the filename of the image, its caption and its alt text all together in a JSON-encoded format.</translate>

<span id="admin/sql/install.mysql.utf8.sql">
<tt>admin/sql/install.mysql.utf8.sql</tt>
<source lang="sql" highlight="12">
DROP TABLE IF EXISTS `#__helloworld`;

CREATE TABLE `#__helloworld` (
`id` INT(11) NOT NULL AUTO_INCREMENT,
`asset_id` INT(10) NOT NULL DEFAULT '0',
`created` DATETIME NOT NULL DEFAULT '0000-00-00 00:00:00',
`created_by` INT(10) UNSIGNED NOT NULL DEFAULT '0',
`greeting` VARCHAR(25) NOT NULL,
`published` tinyint(4) NOT NULL DEFAULT '1',
`catid` int(11) NOT NULL DEFAULT '0',
`params` VARCHAR(1024) NOT NULL DEFAULT '',
`image` VARCHAR(1024) NOT NULL DEFAULT '',
PRIMARY KEY (`id`)
)
ENGINE =MyISAM
AUTO_INCREMENT =0
DEFAULT CHARSET =utf8;

INSERT INTO `#__helloworld` (`greeting`) VALUES
('Hello World!'),
('Goodbye World!');
</source>
</span>

<span id="admin/sql/updates/mysql/0.0.17.sql">
<tt>/admin/sql/updates/mysql/0.0.17.sql</tt>
<source lang="sql">
ALTER TABLE `#__helloworld` ADD `image` VARCHAR(1024) NOT NULL DEFAULT '';
</source>
</span>

<translate>
== Admin Helloworld Edit Form == 
</translate>
<translate> We need to add our image fields into the form definition, and we'll put them all inside a fieldset to enable them to be output easily within the layout file.</translate>

<span id="admin/models/forms/helloworld.xml">
<tt>admin/models/forms/helloworld.xml</tt>
<source lang="xml" highlight="37-59">
<?xml version="1.0" encoding="utf-8"?>
<form
addrulepath="/administrator/components/com_helloworld/models/rules"
>
<fieldset
name="details"
label="COM_HELLOWORLD_HELLOWORLD_DETAILS"
>
<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=""
/>
<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>
<fields name="imageinfo">
<fieldset
name="image-info"
label="COM_HELLOWORLD_IMAGE_FIELDS"
>
<field
name="image"
type="media"
preview="tooltip"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_DESC" />
<field name="alt"
type="text"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_DESC"
size="30"/>
<field name="caption"
type="text"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_DESC"
size="30"/>
</fieldset>
</fields>
<fields name="params">
<fieldset
name="params"
label="JGLOBAL_FIELDSET_DISPLAY_OPTIONS"
>
<field
name="show_category"
type="list"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC"
default=""
>
<option value="">JGLOBAL_USE_GLOBAL</option>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
</field>
</fieldset>
</fields>
<fieldset
name="accesscontrol"
label="COM_HELLOWORLD_FIELDSET_RULES"
>
<field
name="asset_id"
type="hidden"
filter="unset"
/>
<field
name="rules"
type="rules"
label="COM_HELLOWORLD_FIELD_RULES_LABEL"
filter="rules"
validate="rules"
class="inputbox"
component="com_helloworld"
section="message"
/>
</fieldset>
</form>

</source>
</span>

<translate> And in our layout file we'll output that fieldset into a new tab on our form.</translate>

<span id="admin/views/helloworld/tmpl/edit.php">
<tt>admin/views/helloworld/tmpl/edit.php</tt>
<source lang='php' highlight="46-55">
<?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
defined('_JEXEC') or die('Restricted access');
JHtml::_('behavior.formvalidator');

// The following is to enable setting the permission's Calculated Setting
// when you change the permission's Setting.
// The core javascript code for initiating the Ajax request looks for a field
// with id="jform_title" and sets its value as the 'title' parameter to send in the Ajax request
JFactory::getDocument()->addScriptDeclaration('
jQuery(document).ready(function() {
greeting = jQuery("#jform_greeting").val();
jQuery("#jform_title").val(greeting);
});
');

?>
<form action="<?php echo JRoute::_('index.php?option=com_helloworld&layout=edit&id=' . (int) $this->item->id); ?>"
method="post" name="adminForm" id="adminForm" class="form-validate">

<input id="jform_title" type="hidden" name="helloworld-message-title"/>

<div class="form-horizontal">

<?php echo JHtml::_('bootstrap.startTabSet', 'myTab', array('active' => 'details')); ?>
<?php echo JHtml::_('bootstrap.addTab', 'myTab', 'details',
empty($this->item->id) ? JText::_('COM_HELLOWORLD_TAB_NEW_MESSAGE') : JText::_('COM_HELLOWORLD_TAB_EDIT_MESSAGE')); ?>
<fieldset class="adminform">
<legend><?php echo JText::_('COM_HELLOWORLD_LEGEND_DETAILS') ?></legend>
<div class="row-fluid">
<div class="span6">
<?php echo $this->form->renderFieldset('details'); ?>
</div>
</div>
</fieldset>
<?php echo JHtml::_('bootstrap.endTab'); ?>

<?php echo JHtml::_('bootstrap.addTab', 'myTab', 'image', JText::_('COM_HELLOWORLD_TAB_IMAGE')); ?>
<fieldset class="adminform">
<legend><?php echo JText::_('COM_HELLOWORLD_LEGEND_IMAGE') ?></legend>
<div class="row-fluid">
<div class="span6">
<?php echo $this->form->renderFieldset('image-info'); ?>
</div>
</div>
</fieldset>
<?php echo JHtml::_('bootstrap.endTab'); ?>

<?php echo JHtml::_('bootstrap.addTab', 'myTab', 'params', JText::_('COM_HELLOWORLD_TAB_PARAMS')); ?>
<fieldset class="adminform">
<legend><?php echo JText::_('COM_HELLOWORLD_LEGEND_PARAMS') ?></legend>
<div class="row-fluid">
<div class="span6">
<?php echo $this->form->renderFieldset('params'); ?>
</div>
</div>
</fieldset>
<?php echo JHtml::_('bootstrap.endTab'); ?>

<?php echo JHtml::_('bootstrap.addTab', 'myTab', 'permissions', JText::_('COM_HELLOWORLD_TAB_PERMISSIONS')); ?>
<fieldset class="adminform">
<legend><?php echo JText::_('COM_HELLOWORLD_LEGEND_PERMISSIONS') ?></legend>
<div class="row-fluid">
<div class="span12">
<?php echo $this->form->renderFieldset('accesscontrol'); ?>
</div>
</div>
</fieldset>
<?php echo JHtml::_('bootstrap.endTab'); ?>
<?php echo JHtml::_('bootstrap.endTabSet'); ?>

</div>
<input type="hidden" name="task" value="helloworld.edit" />
<?php echo JHtml::_('form.token'); ?>
</form>

</source>
</span>

<translate> Next we need to consider how to include the image information within the data which is used to prefill the edit form. At the moment, our code is calling getItem() within the model (specifically within the JModelAdmin class), and this will get the image field ok, but the data will be in JSON-encoded format. So what we can do is</translate>
<translate>
* override the JModelAdmin getItem() with a getItem() in our own model,
* inside our getItem() we call the parent JModelAdmin getItem() version to get the data from the database, then,
* we convert the image info into individual array fields.</translate>
<translate> We'll use the [https://github.com/joomla-framework/registry Joomla Registry] class to handle the conversion, but as it's in a different namespace we'll need to tell PHP where to find it. Note that we're putting the image data into <tt>item->imageinfo</tt>, as this has to match the name attribute within the <tt><fields></tt> section of our edit form xml definition.</translate>

<span id="admin/models/helloworld.php">
<tt>admin/models/helloworld.php</tt>
<source lang='php' highlight="13,22-35">
<?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');

use Joomla\Registry\Registry;

/**
* HelloWorld Model
*
* @since 0.0.1
*/
class HelloWorldModelHelloWorld extends JModelAdmin
{
/**
* Method to override getItem to allow us to convert the JSON-encoded image information
* in the database record into an array for subsequent prefilling of the edit form
*/
public function getItem($pk = null)
{
$item = parent::getItem($pk);
if ($item AND property_exists($item, 'image'))
{
$registry = new Registry($item->image);
$item->imageinfo = $registry->toArray();
}
return $item;
}
/**
* Method to get a table object, load it if necessary.
*
* @param string $type The table name. Optional.
* @param string $prefix The class prefix. Optional.
* @param array $config Configuration array for model. Optional.
*
* @return JTable A JTable object
*
* @since 1.6
*/
public function getTable($type = 'HelloWorld', $prefix = 'HelloWorldTable', $config = array())
{
return JTable::getInstance($type, $prefix, $config);
}

/**
* Method to get the record form.
*
* @param array $data Data for the form.
* @param boolean $loadData True if the form is to load its own data (default case), false if not.
*
* @return mixed A JForm object on success, false on failure
*
* @since 1.6
*/
public function getForm($data = array(), $loadData = true)
{
// Get the form.
$form = $this->loadForm(
'com_helloworld.helloworld',
'helloworld',
array(
'control' => 'jform',
'load_data' => $loadData
)
);

if (empty($form))
{
return false;
}

return $form;
}
/**
* Method to get the script that have to be included on the form
*
* @return string Script files
*/
public function getScript()
{
return 'administrator/components/com_helloworld/models/forms/helloworld.js';
}
/**
* Method to get the data that should be injected in the form.
*
* @return mixed The data for the form.
*
* @since 1.6
*/
protected function loadFormData()
{
// Check the session for previously entered form data.
$data = JFactory::getApplication()->getUserState(
'com_helloworld.edit.helloworld.data',
array()
);

if (empty($data))
{
$data = $this->getItem();
}

return $data;
}
/**
* Method to check if it's OK to delete a message. Overrides JModelAdmin::canDelete
*/
protected function canDelete($record)
{
if( !empty( $record->id ) )
{
return JFactory::getUser()->authorise( "core.delete", "com_helloworld.helloworld." . $record->id );
}
}
}

</source>
</span>

<translate> Finally we have to consider handling the HTTP POST when the administrator submits the edit form. In particular, we will have the image information in array format, and we'll have to JSON-encode this before we put it into the database field. To manage this we'll take the same approach as in [[S:MyLanguage/J3.x:Developing an MVC Component/Adding configuration|Adding configuration]] and we'll convert the data within the bind() override of our JTable class.</translate>

<span id="admin/tables/helloworld.php">
<tt>admin/tables/helloworld.php</tt>
<source lang="php" highlight="46-52">
<?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
defined('_JEXEC') or die('Restricted access');

/**
* Hello Table class
*
* @since 0.0.1
*/
class HelloWorldTableHelloWorld extends JTable
{
/**
* Constructor
*
* @param JDatabaseDriver &$db A database connector object
*/
function __construct(&$db)
{
parent::__construct('#__helloworld', 'id', $db);
}
/**
* Overloaded bind function
*
* @param array named array
* @return null|string null is operation was satisfactory, otherwise returns an error
* @see JTable:bind
* @since 1.5
*/
public function bind($array, $ignore = '')
{
if (isset($array['params']) && is_array($array['params']))
{
// Convert the params field to a string.
$parameter = new JRegistry;
$parameter->loadArray($array['params']);
$array['params'] = (string)$parameter;
}

if (isset($array['imageinfo']) && is_array($array['imageinfo']))
{
// Convert the imageinfo array to a string.
$parameter = new JRegistry;
$parameter->loadArray($array['imageinfo']);
$array['image'] = (string)$parameter;
}

// Bind the rules.
if (isset($array['rules']) && is_array($array['rules']))
{
$rules = new JAccessRules($array['rules']);
$this->setRules($rules);
}

return parent::bind($array, $ignore);
}

/**
* Method to compute the default name of the asset.
* The default name is in the form `table_name.id`
* where id is the value of the primary key of the table.
*
* @return string
* @since 2.5
*/
protected function _getAssetName()
{
$k = $this->_tbl_key;
return 'com_helloworld.helloworld.'.(int) $this->$k;
}
/**
* Method to return the title to use for the asset table.
*
* @return string
* @since 2.5
*/
protected function _getAssetTitle()
{
return $this->greeting;
}
/**
* Method to get the asset-parent-id of the item
*
* @return int
*/
protected function _getAssetParentId(JTable $table = NULL, $id = NULL)
{
// We will retrieve the parent-asset from the Asset-table
$assetParent = JTable::getInstance('Asset');
// Default: if no asset-parent can be found we take the global asset
$assetParentId = $assetParent->getRootId();

// Find the parent-asset
if (($this->catid)&& !empty($this->catid))
{
// The item has a category as asset-parent
$assetParent->loadByName('com_helloworld.category.' . (int) $this->catid);
}
else
{
// The item has the component as asset-parent
$assetParent->loadByName('com_helloworld');
}

// Return the found asset-parent-id
if ($assetParent->id)
{
$assetParentId=$assetParent->id;
}
return $assetParentId;
}
}

</source>
</span>

<translate>
== Admin Helloworlds List View == 
</translate>
<translate> Within our Helloworlds model we need to include our image information within the SQL query. However, because this image information is JSON-encoded it's not going to be possible to order by any of the subitems via a SQL ORDER BY clause, so we'll not provide functionality to sort by the equivalent image column in the display, and so there's no need to add any fields to the <tt>filter-fields</tt> array.</translate>

<span id="admin/models/helloworlds.php">
<tt>admin/models/helloworlds.php</tt>
<source lang="php" highlight="55-56">
<?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
{
/**
* Constructor.
*
* @param array $config An optional associative array of configuration settings.
*
* @see JController
* @since 1.6
*/
public function __construct($config = array())
{
if (empty($config['filter_fields']))
{
$config['filter_fields'] = array(
'id',
'greeting',
'author',
'created',
'published'
);
}

parent::__construct($config);
}

/**
* 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('a.id as id, a.greeting as greeting, a.published as published, a.created as created,
a.image as imageInfo')
->from($db->quoteName('#__helloworld', 'a'));

// Join over the categories.
$query->select($db->quoteName('c.title', 'category_title'))
->join('LEFT', $db->quoteName('#__categories', 'c') . ' ON c.id = a.catid');

// Join with users table to get the username of the author
$query->select($db->quoteName('u.username', 'author'))
->join('LEFT', $db->quoteName('#__users', 'u') . ' ON u.id = a.created_by');

// Filter: like / search
$search = $this->getState('filter.search');

if (!empty($search))
{
$like = $db->quote('%' . $search . '%');
$query->where('greeting LIKE ' . $like);
}

// Filter by published state
$published = $this->getState('filter.published');

if (is_numeric($published))
{
$query->where('a.published = ' . (int) $published);
}
elseif ($published === '')
{
$query->where('(a.published IN (0, 1))');
}

// Add the list ordering clause.
$orderCol = $this->state->get('list.ordering', 'greeting');
$orderDirn = $this->state->get('list.direction', 'asc');

$query->order($db->escape($orderCol) . ' ' . $db->escape($orderDirn));

return $query;
}
}
</source>
</span>
<translate>

As before, we'll need to convert the JSON-encode image information into an array format, and we'll do that in the layout file, as we've already got a for loop there which cycles through the records. So our view file won't require any changes.</translate>

<translate> In the layout file we'll have a column for the image caption text, and we'll display the image as a tooltip, with help from some of the Bootstrap functionality.</translate>

<span id="admin/views/helloworlds/tmpl/default.php">
<tt>admin/views/helloworlds/tmpl/default.php</tt>
<source lang="php" highlight="13,46-49,52,74-75,90-96">
<?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');

use Joomla\Registry\Registry;

JHtml::_('formbehavior.chosen', 'select');

$listOrder = $this->escape($this->state->get('list.ordering'));
$listDirn = $this->escape($this->state->get('list.direction'));
?>
<form action="index.php?option=com_helloworld&view=helloworlds" method="post" id="adminForm" name="adminForm">
<div id="j-sidebar-container" class="span2">
<?php echo JHtmlSidebar::render(); ?>
</div>
<div id="j-main-container" class="span10">
<div class="row-fluid">
<div class="span6">
<?php echo JText::_('COM_HELLOWORLD_HELLOWORLDS_FILTER'); ?>
<?php
echo JLayoutHelper::render(
'joomla.searchtools.default',
array('view' => $this)
);
?>
</div>
</div>
<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="30%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_HELLOWORLDS_NAME', 'greeting', $listDirn, $listOrder); ?>
</th>
<th width="30%">
<?php echo JText::_('COM_HELLOWORLD_HELLOWORLDS_IMAGE'); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_AUTHOR', 'author', $listDirn, $listOrder); ?>
</th>
<th width="15%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_CREATED_DATE', 'created', $listDirn, $listOrder); ?>
</th>
<th width="5%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_PUBLISHED', 'published', $listDirn, $listOrder); ?>
</th>
<th width="2%">
<?php echo JHtml::_('searchtools.sort', 'COM_HELLOWORLD_ID', 'id', $listDirn, $listOrder); ?>
</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) :
$link = JRoute::_('index.php?option=com_helloworld&task=helloworld.edit&id=' . $row->id);
$row->image = new Registry;
$row->image->loadString($row->imageinfo);
?>
<tr>
<td><?php echo $this->pagination->getRowOffset($i); ?></td>
<td>
<?php echo JHtml::_('grid.id', $i, $row->id); ?>
</td>
<td>
<a href="<?php echo $link; ?>" title="<?php echo JText::_('COM_HELLOWORLD_EDIT_HELLOWORLD'); ?>">
<?php echo $row->greeting; ?>
</a>
<div class="small">
<?php echo JText::_('JCATEGORY') . ': ' . $this->escape($row->category_title); ?>
</div>
</td>
<td align="center">
<?php
$caption = $row->image->get('caption') ? : '' ;
$src = JURI::root() . ($row->image->get('image') ? : '' );
$html = '<p class="hasTooltip" style="display: inline-block" data-html="true" data-toggle="tooltip" data-placement="right" title="<img width=\'100px\' height=\'100px\' src=\'%s\'>">%s</p>';
echo sprintf($html, $src, $caption); ?>
</td>
<td align="center">
<?php echo $row->author; ?>
</td>
<td align="center">
<?php echo substr($row->created, 0, 10); ?>
</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>
<input type="hidden" name="task" value=""/>
<input type="hidden" name="boxchecked" value="0"/>
<?php echo JHtml::_('form.token'); ?>
</div>
</form>
</source>
</span>

<translate>
== Site Helloworld Display == 
</translate>
<translate> Early on in this series we developed the functionality to display a Helloworld greeting on a front-end webpage. Now we're going to add the image to that page, and we'll need to make the following changes:</translate>
<translate>
* helloworld model - include the image info within the data we read from the database, and convert it into an array format
* helloworld layout - display the image on the page.</translate>
<translate> Neither the controller nor view will require any changes.</translate>

<span id="site/models/helloworld.php">
<tt>site/models/helloworld.php</tt>
<source lang="php" highlight="76,94-97">
<?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');

/**
* HelloWorld Model
*
* @since 0.0.1
*/
class HelloWorldModelHelloWorld extends JModelItem
{
/**
* @var object item
*/
protected $item;

/**
* Method to auto-populate the model state.
*
* This method should only be called once per instantiation and is designed
* to be called on the first call to the getState() method unless the model
* configuration flag to ignore the request is set.
*
* Note. Calling getState in this method will result in recursion.
*
* @return void
* @since 2.5
*/
protected function populateState()
{
// Get the message id
$jinput = JFactory::getApplication()->input;
$id = $jinput->get('id', 1, 'INT');
$this->setState('message.id', $id);

// Load the parameters.
$this->setState('params', JFactory::getApplication()->getParams());
parent::populateState();
}

/**
* Method to get a table object, load it if necessary.
*
* @param string $type The table name. Optional.
* @param string $prefix The class prefix. Optional.
* @param array $config Configuration array for model. Optional.
*
* @return JTable A JTable object
*
* @since 1.6
*/
public function getTable($type = 'HelloWorld', $prefix = 'HelloWorldTable', $config = array())
{
return JTable::getInstance($type, $prefix, $config);
}

/**
* Get the message
* @return object The message to be displayed to the user
*/
public function getItem()
{
if (!isset($this->item))
{
$id = $this->getState('message.id');
$db = JFactory::getDbo();
$query = $db->getQuery(true);
$query->select('h.greeting, h.params, h.image as image, c.title as category')
->from('#__helloworld as h')
->leftJoin('#__categories as c ON h.catid=c.id')
->where('h.id=' . (int)$id);
$db->setQuery((string)$query);

if ($this->item = $db->loadObject())
{
// Load the JSON string
$params = new JRegistry;
$params->loadString($this->item->params, 'JSON');
$this->item->params = $params;

// Merge global params with item params
$params = clone $this->getState('params');
$params->merge($this->item->params);
$this->item->params = $params;

// Convert the JSON-encoded image info into an array
$image = new JRegistry;
$image->loadString($this->item->image, 'JSON');
$this->item->imageDetails = $image;
}
}
return $this->item;
}
}

</source>
</span>

<span id="site/views/helloworld/tmpl/default.php">
<tt>site/views/helloworld/tmpl/default.php</tt>
<source lang="php" highlight="16-27">
<?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');
?>
<h1><?php echo $this->item->greeting.(($this->item->category and $this->item->params->get('show_category'))
? (' ('.$this->item->category.')') : ''); ?>
</h1>
<?php
$src = $this->item->imageDetails['image'];
if ($src)
{
$html = '<figure>
<img src="%s" alt="%s" >
<figcaption>%s</figcaption>
</figure>';
$alt = $this->item->imageDetails['alt'];
$caption = $this->item->imageDetails['caption'];
echo sprintf($html, $src, $alt, $caption);
} ?>

</source>
</span>

<translate>
== Site Helloworld Form == 
</translate>
<translate> We'll enhance this form to allow the user to upload an image, together with the associated caption and alt text, so we'll need those fields in the XML form definition.</translate>

<span id="site/models/forms/add-form.xml">
<tt>site/models/forms/add-form.xml</tt>
<source lang="xml" highlight="37-64">
<?xml version="1.0" encoding="utf-8"?>
<form
addrulepath="/administrator/components/com_helloworld/models/rules"
>
<fieldset
name="details"
label="COM_HELLOWORLD_HELLOWORLD_DETAILS"
>
<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"
required="true"
hint="COM_HELLOWORLD_HELLOWORLD_GREETING_HINT"
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>
<fields name="imageinfo" label="COM_HELLOWORLD_HELLOWORLD_IMAGE_LABEL">
<field
name="image"
type="file"
label="COM_HELLOWORLD_HELLOWORLD_PICTURE_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_PICTURE_DESC"
accept="image/*"
>
</field>
<field
name="caption"
type="text"
label="COM_HELLOWORLD_HELLOWORLD_CAPTION_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_CAPTION_DESC"
size="40"
class="inputbox"
>
</field>
<field
name="alt"
type="text"
label="COM_HELLOWORLD_HELLOWORLD_ALTTEXT_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_ALTTEXT_DESC"
size="40"
class="inputbox"
>
</field>
</fields>
<field
name="message"
type="textarea"
rows="5"
cols="80"
label="COM_HELLOWORLD_HELLOWORLD_MESSAGE_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_MESSAGE_DESC"
hint="COM_HELLOWORLD_HELLOWORLD_MESSAGE_HINT"
required="true"
>
</field>
<field
name="captcha"
type="captcha"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_DESC"
validate="captcha"
>
</field>
<fields name="params">
<field
name="show_category"
type="list"
label="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL"
description="COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC"
default=""
useglobal="true"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
</field>
</fields>
</fieldset>
</form>

</source>
</span>

<translate> Let's now consider the image data conversion between the database and the form.</translate>

<translate> In the direction database to form, in the front end we're not going to be editing an existing record, we're just allowing the user to enter a new record, so we don't need to worry about conversion in this direction.</translate>
<translate>

In the direction form to database, the model save() method is using JTable functionality to write to the database, so the bind() method override which we wrote above will apply on the site side as well. So this is covered ok too; we just needed to ensure that the fields in our add-form.xml above had name attributes which are the same as those in the admin form helloworld.xml above.</translate>

<translate> In terms of displaying the front-end form, our controller, (form) view and (form) model will not require any changes. Our layout file will require the attribute <tt>enctype="multipart/form-data"</tt> added to the <tt><form></tt> tag to enable a file upload.</translate>

<span id="site/views/form/tmpl/edit.php">
<tt>site/views/form/tmpl/edit.php</tt>
<source lang="php" highlight="19">
<?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
*
* This layout file is for displaying the front end form for capturing a new helloworld message
*
*/

// No direct access
defined('_JEXEC') or die('Restricted access');
JHtml::_('behavior.formvalidator');

?>
<form action="<?php echo JRoute::_('index.php?option=com_helloworld&view=form&layout=edit'); ?>"
method="post" name="adminForm" id="adminForm" class="form-validate" enctype="multipart/form-data">

<div class="form-horizontal">
<fieldset class="adminform">
<legend><?php echo JText::_('COM_HELLOWORLD_LEGEND_DETAILS') ?></legend>
<div class="row-fluid">
<div class="span6">
<?php echo $this->form->renderFieldset('details'); ?>
</div>
</div>
</fieldset>
</div>

<div class="btn-toolbar">
<div class="btn-group">
<button type="button" class="btn btn-primary" onclick="Joomla.submitbutton('helloworld.save')">
<span class="icon-ok"></span><?php echo JText::_('JSAVE') ?>
</button>
</div>
<div class="btn-group">
<button type="button" class="btn" onclick="Joomla.submitbutton('helloworld.cancel')">
<span class="icon-cancel"></span><?php echo JText::_('JCANCEL') ?>
</button>
</div>
</div>

<input type="hidden" name="task" />
<?php echo JHtml::_('form.token'); ?>
</form>
</source>
</span>

<translate> And there are significant changes in our controller which handles the HTTP POST from the form.</translate>

<span id="site/controllers/helloworld.php">
<tt>site/controllers/helloworld.php</tt>
<source lang="php" highlight="67-70,106-107,110-176,185,188-189">
<?php
/**
* @package Joomla.Site
* @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');

/**
* HelloWorld Controller
*
* @package Joomla.Site
* @subpackage com_helloworld
*
* Used to handle the http POST from the front-end form which allows
* users to enter a new helloworld message
*
*/
class HelloWorldControllerHelloWorld extends JControllerForm
{
public function cancel($key = null)
{
parent::cancel($key);

// set up the redirect back to the same form
$this->setRedirect(
(string)JUri::getInstance(),
JText::_(COM_HELLOWORLD_ADD_CANCELLED)
);
}

/*
* Function handing the save for adding a new helloworld record
* Based on the save() function in the JControllerForm class
*/
public function save($key = null, $urlVar = null)
{
// Check for request forgeries.
JSession::checkToken() or jexit(JText::_('JINVALID_TOKEN'));

$app = JFactory::getApplication();
$input = $app->input;
$model = $this->getModel('form');

// Get the current URI to set in redirects. As we're handling a POST,
// this URI comes from the <form action="..."> attribute in the layout file above
$currentUri = (string)JUri::getInstance();

// Check that this user is allowed to add a new record
if (!JFactory::getUser()->authorise( "core.create", "com_helloworld"))
{
$app->enqueueMessage(JText::_('JERROR_ALERTNOAUTHOR'), 'error');
$app->setHeader('status', 403, true);

return;
}

// get the data from the HTTP POST request
$data = $input->get('jform', array(), 'array');

// set up context for saving form data
$context = "$this->option.edit.$this->context";

// save the form data and set up the redirect back to the same form,
// to avoid repeating them under every error condition
$app->setUserState($context . '.data', $data);
$this->setRedirect($currentUri);

// Validate the posted data.
// First we need to set up an instance of the form ...
$form = $model->getForm($data, false);

if (!$form)
{
$app->enqueueMessage($model->getError(), 'error');
return false;
}

// ... and then we validate the data against it
// The validate function called below results in the running of the validate="..." routines
// specified against the fields in the form xml file, and also filters the data
// according to the filter="..." specified in the same place (removing html tags by default in strings)
$validData = $model->validate($form, $data);

// Handle the case where there are validation errors
if ($validData === false)
{
// Get the validation messages.
$errors = $model->getErrors();

// Display up to three validation messages to the user.
for ($i = 0, $n = count($errors); $i < $n && $i < 3; $i++)
{
if ($errors[$i] instanceof Exception)
{
$app->enqueueMessage($errors[$i]->getMessage(), 'warning');
}
else
{
$app->enqueueMessage($errors[$i], 'warning');
}
}

return false;
}

// Handle the uploaded file - get it from the PHP $_FILES structure
$fileinfo = $this->input->files->get('jform', array(), 'array');
$file = $fileinfo['imageinfo']['image'];
/* The $file variable above should contain an array of 5 elements as follows:
* name: the name of the file (on the system from which it was uploaded), without directory info
* type: should be something like image/jpeg
* tmp_name: pathname of the file where PHP has stored the uploaded data
* error: 0 if no error
* size: size of the file in bytes
*/

// Check if any files have been uploaded
if ($file['error'] == 4) // no file uploaded (see PHP file upload error conditions)
{
$validData['imageinfo'] = null;
}
else
{
if ($file['error'] > 0)
{
$app->enqueueMessage(JText::sprintf('COM_HELLOWORLD_ERROR_FILEUPLOAD', $file['error']), 'warning');
return false;
}

// make sure filename is clean
jimport('joomla.filesystem.file');
$file['name'] = JFile::makeSafe($file['name']);
if (!isset($file['name']))
{
// No filename (after the name was cleaned by JFile::makeSafe)
$app->enqueueMessage(JText::_('COM_HELLOWORLD_ERROR_BADFILENAME'), 'warning');
return false;
}

// files from Microsoft Windows can have spaces in the filenames
$file['name'] = str_replace(' ', '-', $file['name']);

// do checks against Media configuration parameters
$mediaHelper = new JHelperMedia;
if (!$mediaHelper->canUpload($file))
{
// The file can't be uploaded - the helper class will have enqueued the error message
return false;
}

// prepare the uploaded file's destination pathnames
$mediaparams = JComponentHelper::getParams('com_media');
$relativePathname = JPath::clean($mediaparams->get($path, 'images') . '/' . $file['name']);
$absolutePathname = JPATH_ROOT . '/' . $relativePathname;
if (JFile::exists($absolutePathname))
{
// A file with this name already exists
$app->enqueueMessage(JText::_('COM_HELLOWORLD_ERROR_FILE_EXISTS'), 'warning');
return false;
}

// check file contents are clean, and copy it to destination pathname
if (!JFile::upload($file['tmp_name'], $absolutePathname))
{
// Error in upload
$app->enqueueMessage(JText::_('COM_HELLOWORLD_ERROR_UNABLE_TO_UPLOAD_FILE'));
return false;
}

// Upload succeeded, so update the relative filename for storing in database
$validData['imageinfo']['image'] = $relativePathname;
}

// add the 'created by' and 'created' date fields
$validData['created_by'] = JFactory::getUser()->get('id', 0);
$validData['created'] = date('Y-m-d h:i:s');

// Attempt to save the data.
if (!$model->save($validData))
{
// Handle the case where the save failed
$this->setError(JText::sprintf('JLIB_APPLICATION_ERROR_SAVE_FAILED', $model->getError()));
$this->setMessage($this->getError(), 'error');

return false;
}

// clear the data in the form
$app->setUserState($context . '.data', null);

// notify the administrator that a new helloworld message has been added on the front end

// get the id of the person to notify from global config
$params = $app->getParams();
$userid_to_email = (int) $params->get('user_to_email');
$user_to_email = JUser::getInstance($userid_to_email);
$to_address = $user_to_email->get("email");

// get the current user (if any)
$current_user = JFactory::getUser();
if ($current_user->get("id") > 0)
{
$current_username = $current_user->get("username");
}
else
{
$current_username = "a visitor to the site";
}

// get the Mailer object, set up the email to be sent, and send it
$mailer = JFactory::getMailer();
$mailer->addRecipient($to_address);
$mailer->setSubject("New helloworld message added by " . $current_username);
$mailer->setBody("New greeting is " . $validData['greeting']);
try
{
$mailer->send();
}
catch (Exception $e)
{
JLog::add('Caught exception: ' . $e->getMessage(), JLog::Error, 'jerror');
}

$this->setRedirect(
$currentUri,
JText::_('COM_HELLOWORLD_ADD_SUCCESSFUL')
);

return true;

}

}
</source>
</span>
<translate>
== Updated Language Strings == 
</translate>

<span id="site/language/en-GB/en-GB.com_helloworld.ini">
<tt>site/language/en-GB/en-GB.com_helloworld.ini</tt>
<source lang="text" highlight="18-24,28-33">
; add new message form
COM_HELLOWORLD_LEGEND_DETAILS="New Helloworld Message Details"
COM_HELLOWORLD_HELLOWORLD_CREATING="Add message"
COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE="Sorry, you have an error"
COM_HELLOWORLD_HELLOWORLD_DETAILS="Message details"
COM_HELLOWORLD_HELLOWORLD_GREETING_LABEL="Greeting"
COM_HELLOWORLD_HELLOWORLD_GREETING_DESC="Please specify the greeting to add"
COM_HELLOWORLD_HELLOWORLD_GREETING_HINT="Letters only!"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_LABEL="Category"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_DESC="Please select the associated category"
COM_HELLOWORLD_HELLOWORLD_MESSAGE_LABEL="Reason"
COM_HELLOWORLD_HELLOWORLD_MESSAGE_DESC="Please say why you're adding this greeting"
COM_HELLOWORLD_HELLOWORLD_MESSAGE_HINT="No HTML tags!"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_LABEL="Spam protection"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_DESC="Prove you're a real person!"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL="Display category or not?"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC="Select if you want the category displayed too"
COM_HELLOWORLD_HELLOWORLD_IMAGE_LABEL="Image information"
COM_HELLOWORLD_HELLOWORLD_PICTURE_LABEL="Image file to upload"
COM_HELLOWORLD_HELLOWORLD_PICTURE_DESC="Select the file with the image to upload"
COM_HELLOWORLD_HELLOWORLD_CAPTION_LABEL="Caption"
COM_HELLOWORLD_HELLOWORLD_CAPTION_DESC="Text to use as a caption for the image"
COM_HELLOWORLD_HELLOWORLD_ALTTEXT_LABEL="Alt text"
COM_HELLOWORLD_HELLOWORLD_ALTTEXT_DESC="Text to display if image cannot be shown"
; save and cancel confirmation messages
COM_HELLOWORLD_ADD_SUCCESSFUL="New greeting successfully saved"
COM_HELLOWORLD_ADD_CANCELLED="New greeting cancelled ok"
; file upload error conditions
COM_HELLOWORLD_ERROR_FILEUPLOAD="PHP Error %s encountered when uploading file"
COM_HELLOWORLD_ERROR_FILETOOLARGE="Upload file exceeds max size configured in Joomla"
COM_HELLOWORLD_ERROR_BADFILENAME="Upload file has an invalid filename"
COM_HELLOWORLD_ERROR_FILE_EXISTS="Upload file already exists"
COM_HELLOWORLD_ERROR_UNABLE_TO_UPLOAD_FILE="Error creating uploaded file"
</source>
</span>

<span id="admin/language/en-GB/en-GB.com_helloworld.ini">
<tt>admin/language/en-GB/en-GB.com_helloworld.ini</tt>
<source lang="text" highlight="14,27-33,63,67">
; Joomla! Project
; Copyright (C) 2005 - 2018 Open Source Matters. All rights reserved.
; License GNU General Public License version 2 or later; see LICENSE.txt, see LICENSE.php
; Note : All ini files need to be saved as UTF-8

COM_HELLOWORLD_ADMINISTRATION="HelloWorld - Administration"
COM_HELLOWORLD_ADMINISTRATION_CATEGORIES="HelloWorld - Categories"
COM_HELLOWORLD_NUM="#"
COM_HELLOWORLD_HELLOWORLDS_FILTER="Filters"
COM_HELLOWORLD_AUTHOR="Author"
COM_HELLOWORLD_CREATED_DATE="Created"
COM_HELLOWORLD_PUBLISHED="Published"
COM_HELLOWORLD_HELLOWORLDS_NAME="Name"
COM_HELLOWORLD_HELLOWORLDS_IMAGE="Image"
COM_HELLOWORLD_ID="Id"

COM_HELLOWORLD_HELLOWORLD_CREATING="HelloWorld - Creating"
COM_HELLOWORLD_HELLOWORLD_DETAILS="Details"
COM_HELLOWORLD_HELLOWORLD_EDITING="HelloWorld - Editing"
COM_HELLOWORLD_HELLOWORLD_ERROR_UNACCEPTABLE="Some values are unacceptable"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_DESC="The category the messages belongs to"
COM_HELLOWORLD_HELLOWORLD_FIELD_CATID_LABEL="Category"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_DESC="This message will be displayed"
COM_HELLOWORLD_HELLOWORLD_FIELD_GREETING_LABEL="Message"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_LABEL="Show category"
COM_HELLOWORLD_HELLOWORLD_FIELD_SHOW_CATEGORY_DESC="If set to Show, the title of the message’s category will show."
COM_HELLOWORLD_IMAGE_FIELDS="Image details"
COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_LABEL="Select image"
COM_HELLOWORLD_HELLOWORLD_FIELD_IMAGE_DESC="Select an image from the library, or upload a new one"
COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_LABEL="Alt text"
COM_HELLOWORLD_HELLOWORLD_FIELD_ALT_DESC="Alternative text (if image cannot be displayed)"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_LABEL="Caption"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTION_DESC="Provide a caption for the image"
COM_HELLOWORLD_HELLOWORLD_HEADING_GREETING="Greeting"
COM_HELLOWORLD_HELLOWORLD_HEADING_ID="Id"
COM_HELLOWORLD_MANAGER_HELLOWORLD_EDIT="HelloWorld manager: Edit Message"
COM_HELLOWORLD_MANAGER_HELLOWORLD_NEW="HelloWorld manager: New Message"
COM_HELLOWORLD_MANAGER_HELLOWORLDS="HelloWorld manager"
COM_HELLOWORLD_EDIT_HELLOWORLD="Edit message"
COM_HELLOWORLD_N_ITEMS_DELETED_1="One message deleted"
COM_HELLOWORLD_N_ITEMS_DELETED_MORE="%d messages deleted"
COM_HELLOWORLD_N_ITEMS_PUBLISHED="%d message(s) published"
COM_HELLOWORLD_N_ITEMS_UNPUBLISHED="%d message(s) unpublished"
COM_HELLOWORLD_HELLOWORLD_GREETING_LABEL="Greeting"
COM_HELLOWORLD_HELLOWORLD_GREETING_DESC="Add Hello World Greeting"
COM_HELLOWORLD_SUBMENU_MESSAGES="Messages"
COM_HELLOWORLD_SUBMENU_CATEGORIES="Categories"
COM_HELLOWORLD_CONFIGURATION="HelloWorld Configuration"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_LABEL="Messages settings"
COM_HELLOWORLD_CONFIG_GREETING_SETTINGS_DESC="Settings that will be applied to all messages by default"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_LABEL="Captcha"
COM_HELLOWORLD_HELLOWORLD_FIELD_CAPTCHA_DESC="Select Captcha to use on front end form"
COM_HELLOWORLD_HELLOWORLD_FIELD_USER_TO_EMAIL_LABEL="User to email"
COM_HELLOWORLD_HELLOWORLD_FIELD_USER_TO_EMAIL_DESC="Select user to email when a new message is entered on front end"
COM_HELLOWORLD_FIELDSET_RULES="Message Permissions"
COM_HELLOWORLD_FIELD_RULES_LABEL="Permissions"
COM_HELLOWORLD_ACCESS_DELETE_DESC="Is this group allowed to edit this message?"
COM_HELLOWORLD_ACCESS_DELETE_DESC="Is this group allowed to delete this message?"
COM_HELLOWORLD_TAB_NEW_MESSAGE="New Message"
COM_HELLOWORLD_TAB_EDIT_MESSAGE="Message Details"
COM_HELLOWORLD_TAB_PARAMS="Parameters"
COM_HELLOWORLD_TAB_PERMISSIONS="Permissions"
COM_HELLOWORLD_TAB_IMAGE="Image"
COM_HELLOWORLD_LEGEND_DETAILS="Message Details"
COM_HELLOWORLD_LEGEND_PARAMS="Message Parameters"
COM_HELLOWORLD_LEGEND_PERMISSIONS="Message Permissions"
COM_HELLOWORLD_LEGEND_IMAGE="Image info"
; Column ordering in the Helloworlds view
COM_HELLOWORLD_ORDERING_ASC="Greeting ascending"
COM_HELLOWORLD_ORDERING_DESC="Greeting descending"
COM_HELLOWORLD_AUTHOR_ASC="Author ascending"
COM_HELLOWORLD_AUTHOR_DESC="Author descending"
COM_HELLOWORLD_CREATED_ASC="Creation date ascending"
COM_HELLOWORLD_CREATED_DESC="Creation date descending"
COM_HELLOWORLD_PUBLISHED_ASC="Unpublished first"
COM_HELLOWORLD_PUBLISHED_DESC="Published first"
</source>
</span>

<translate>
==Packaging the Component== 
</translate>
<translate> Contents of your code directory. Each file link below takes you to the step in the tutorial which has the latest version of that source code file.</translate>

* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#helloworld.xml|helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding an install-uninstall-update script file#script.php|script.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#site/controller.php|site/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/controllers/helloworld.php|site/controllers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/form/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#site/views/form/view.html.php|site/views/form/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/form/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/views/form/tmpl/edit.php|site/views/form/tmpl/edit.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#site/views/form/tmpl/edit.xml|site/views/form/tmpl/edit.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/models/helloworld.php|site/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#site/models/form.php|site/models/form.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/models/forms/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#site/models/forms/add-form.xml|site/models/forms/add-form.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding_an_Image#site/language/en-GB/en-GB.com_helloworld.ini|site/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/helloworld.php|admin/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/config.xml|admin/config.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Basic_backend#admin/controller.php|admin/controller.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/access.xml|admin/access.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/helpers/helloworld.php|admin/helpers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/helpers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/sql/install.mysql.utf8.sql|admin/sql/install.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/uninstall.mysql.utf8.sql|admin/sql/uninstall.mysql.utf8.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Using_the_database#admin/sql/install.mysql.utf8.sql|admin/sql/updates/mysql/0.0.6.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/sql/updates/mysql/0.0.12.sql|admin/sql/updates/mysql/0.0.12.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_configuration#admin/sql/updates/mysql/0.0.13.sql|admin/sql/updates/mysql/0.0.13.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/sql/updates/mysql/0.0.14.sql|admin/sql/updates/mysql/0.0.14.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#admin/sql/updates/mysql/0.0.16.sql|admin/sql/updates/mysql/0.0.16.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/sql/updates/mysql/0.0.17.sql|admin/sql/updates/mysql/0.0.17.sql]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/fields/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_categories#admin/models/fields/helloworld.php|admin/models/fields/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/models/helloworlds.php|admin/models/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/models/helloworld.php|admin/models/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#admin/models/forms/filter_helloworlds.xml|admin/models/forms/filter_helloworlds.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/forms/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/models/forms/helloworld.js|admin/models/forms/helloworld.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/models/forms/helloworld.xml|admin/models/forms/helloworld.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/models/rules/greeting.php|admin/models/rules/greeting.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/models/rules/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/controllers/helloworld.php|admin/controllers/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_backend_actions#admin/controllers/helloworlds.php|admin/controllers/helloworlds.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/controllers/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_ACL#admin/views/helloworld/view.html.php|admin/views/helloworld/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworld/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/views/helloworld/tmpl/edit.php|admin/views/helloworld/tmpl/edit.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_verifications#admin/views/helloworld/submitbutton.js|admin/views/helloworld/submitbutton.js]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_front-end_form#admin/views/helloworlds/view.html.php|admin/views/helloworlds/view.html.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/views/helloworlds/tmpl/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/views/helloworlds/tmpl/default.php|admin/views/helloworlds/tmpl/default.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/tables/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_an_Image#admin/tables/helloworld.php|admin/tables/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/language/en-GB/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding_an_Image#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.ini|admin/language/en-GB/en-GB.com_helloworld.ini]]''
* ''[[S:MyLanguage/J3.x:Developing an MVC Component/Adding_a_front-end_form#admin.2Flanguage.2Fen-GB.2Fen-GB.com_helloworld.sys.ini|admin/language/en-GB/en-GB.com_helloworld.sys.ini]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|media/images/index.html]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-16x16.png]]''
* ''[[S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_decorations_to_the_backend#Adding_some_icons|media/images/tux-48x48.png]]''

<span id="helloworld.xml">
<tt>helloworld.xml</tt>
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.0" method="upgrade">

<name>COM_HELLOWORLD</name>

<creationDate>February 2015</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>

<version>0.0.17</version>

<description>COM_HELLOWORLD_DESCRIPTION</description>


<scriptfile>script.php</scriptfile>

<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>controllers</folder>
<folder>views</folder>
<folder>models</folder>
</files>

<languages folder="site/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
</languages>

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

<administration>

<menu link='index.php?option=com_helloworld' img="../media/com_helloworld/images/tux-16x16.png">COM_HELLOWORLD_MENU</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>config.xml</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<filename>access.xml</filename>

<folder>sql</folder>

<folder>tables</folder>

<folder>models</folder>

<folder>views</folder>

<folder>controllers</folder>

<folder>helpers</folder>
</files>
<languages folder="admin/language">
<language tag="en-GB">en-GB/en-GB.com_helloworld.ini</language>
<language tag="en-GB">en-GB/en-GB.com_helloworld.sys.ini</language>
</languages>
</administration>

</extension>
</source>
</span>

<translate>
== Contributors == 
</translate>
*[[User:Robbiej|Robbie Jackson]]

{{-}}
<div class="row">
<div class="large-6 columns">{{Basic button|<translate> S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a front-end form|Prev: Adding a front-end form</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate> S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a Map|Next: Adding a map</translate>|class=expand}}</div>
</div>
<noinclude>
[[Category:Joomla! 3.x{{#translation:}}]]
[[Category:Joomla! 3.0{{#translation:}}]]
[[Category:Joomla! 3.1{{#translation:}}]]
[[Category:Joomla! 3.2{{#translation:}}]]
[[Category:Joomla! 3.3{{#translation:}}]]
[[Category:Joomla! 3.4{{#translation:}}]]
[[Category:Beginner Development{{#translation:}}]]
[[Category:Component Development{{#translation:}}]]
[[Category:Tutorials{{#translation:}}]]
[[Category:Tutorials in a Series{{#translation:}}]]
</noinclude>