Joomla! Documentation - User contributions [en]

J3.x:Developing an MVC Component/Adding a model to the site part

2015-09-18T20:04:50Z

Kevinkabatra: Removed {{underconstruction}} tag

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

== Note ==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.zip archive]

== Adding a Model to Hello World! ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/models/test.php| test.php]]
| <tt><path_to_com_helloworld>/site/models/test.php<tt>
|-
| 2
| Create: [[#site/models/index.html| index.html]]
| <tt><path_to_com_helloworld>/site/models/index.html</tt>
|-
| 3
| Update: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld>/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

== File Details ==
{{vanchor|site/models/test.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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 string message
*/
protected $message;

/**
* Get the message
*
* @return string The message to be displayed to the user
*/
public function getMsg()
{
if (!isset($this->message))
{
$this->message = 'Hello World!';
}

return $this->message;
}
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php" highlight="30">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = $this->get('Msg');

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

{{vanchor|site/helloworld.xml}}
<source lang="xml" highlight="13,32">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.4</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== test.php ===

<source lang="php">
class HelloWorldModelHelloWorld extends JModelItem
{
</source>

This class will be called by the class HelloWorldViewHelloWorld.

=== view.html.php ===

<source lang="php">
$this->msg = $this->get('Msg');
</source>

The ''HelloWorldViewHelloWorld'' class asks the model for data using the ''get'' method of the ''JViewLegacy''.

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[#site/models/test.php|site/models/test.php]]''
| file representing the model
|-
|6
| ''[[#site/models/index.html|site/models/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 12
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 17
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 18
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a menu type to the site part|Prev: Adding a menu type to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a variable request in the menu type|Next: Adding a variable request in the menu type</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a model to the site part

2015-09-18T20:04:05Z

Kevinkabatra: /*Component Contents */ added section, added my name to list of Contributors

{{underconstruction}}

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

== Note ==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.zip archive]

== Adding a Model to Hello World! ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/models/test.php| test.php]]
| <tt><path_to_com_helloworld>/site/models/test.php<tt>
|-
| 2
| Create: [[#site/models/index.html| index.html]]
| <tt><path_to_com_helloworld>/site/models/index.html</tt>
|-
| 3
| Update: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld>/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

== File Details ==
{{vanchor|site/models/test.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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 string message
*/
protected $message;

/**
* Get the message
*
* @return string The message to be displayed to the user
*/
public function getMsg()
{
if (!isset($this->message))
{
$this->message = 'Hello World!';
}

return $this->message;
}
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php" highlight="30">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = $this->get('Msg');

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

{{vanchor|site/helloworld.xml}}
<source lang="xml" highlight="13,32">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.4</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== test.php ===

<source lang="php">
class HelloWorldModelHelloWorld extends JModelItem
{
</source>

This class will be called by the class HelloWorldViewHelloWorld.

=== view.html.php ===

<source lang="php">
$this->msg = $this->get('Msg');
</source>

The ''HelloWorldViewHelloWorld'' class asks the model for data using the ''get'' method of the ''JViewLegacy''.

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[#site/models/test.php|site/models/test.php]]''
| file representing the model
|-
|6
| ''[[#site/models/index.html|site/models/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 12
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 17
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 18
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a menu type to the site part|Prev: Adding a menu type to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a variable request in the menu type|Next: Adding a variable request in the menu type</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a model to the site part

2015-09-18T19:55:47Z

Kevinkabatra: Finished Adding a Model to Hello World!, File Details, and Code Explanation sections

{{underconstruction}}

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

== Note ==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.zip archive]

== Adding a Model to Hello World! ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/models/test.php| test.php]]
| <tt><path_to_com_helloworld>/site/models/test.php<tt>
|-
| 2
| Create: [[#site/models/index.html| index.html]]
| <tt><path_to_com_helloworld>/site/models/index.html</tt>
|-
| 3
| Update: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld>/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

== File Details ==
{{vanchor|site/models/test.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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 string message
*/
protected $message;

/**
* Get the message
*
* @return string The message to be displayed to the user
*/
public function getMsg()
{
if (!isset($this->message))
{
$this->message = 'Hello World!';
}

return $this->message;
}
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php" highlight="30">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = $this->get('Msg');

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

{{vanchor|site/helloworld.xml}}
<source lang="xml" highlight="13,32">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.4</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== test.php ===

<source lang="php">
class HelloWorldModelHelloWorld extends JModelItem
{
</source>

This class will be called by the class HelloWorldViewHelloWorld.

=== view.html.php ===

<source lang="php">
$this->msg = $this->get('Msg');
</source>

The ''HelloWorldViewHelloWorld'' class asks the model for data using the ''get'' method of the ''JViewLegacy''.

<translate>== Packaging the component == 


Content of your code directory</translate>
* ''[[#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_a_view_to_the_site_part#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/Adding_a_menu_type_to_the_site_part#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#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]]''
* ''[[#site/models/helloworld.php|site/models/helloworld.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/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''
<translate>
Create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.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>

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a menu type to the site part|Prev: Adding a menu type to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a variable request in the menu type|Next: Adding a variable request in the menu type</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

Absolute Basics of How a Component Functions

2015-09-18T19:46:50Z

Kevinkabatra: /* Model */

This article is designed for Joomlaǃ beginners; it is designed to explain what a Joomlaǃ component is, and how it functions. When a specific component example will benefit the tutorial, this article will refer to an example component named Hello Worldǃ.

==What is a Joomlaǃ Component==
A component is a kind of Joomla! extension. Components are the main functional units of Joomla!; they can be seen as mini-applications. An easy analogy would be that Joomla! is the operating system and the components are desktop applications. Created by a component, content is usually displayed in the center of the main content area of a template (depending on the template).

Most components have two main parts: an administrator part and a site part. The site part is what is used to render pages of your site when they are requested by your site visitors during normal site operation. The administrator part provides an interface to configure and manage different aspects of the component and is accessible through the Joomla! administrator application.

In the Joomla! framework, components can be designed using a flat model(returns HTML code for the requested page) or Model-View-Controller (herein referred to as MVC) pattern.

==Introduction to MVC==
MVC is a software design pattern that can be used to organize code in such a way that the business logic and data presentation are seperate. The premise behind this approach is that if the business logic is grouped into one section, then the interface and user interaction that surrounds the data can be revised and customized without having to reprogram the business logic. MVC was originally developed to map the traditional input, processing, output roles into a logical GUI architecture.

===Model===
The model is the part of the component that encapsulates the application's data. It will often provide routines to manage and manipulate this data in a meaningful way in addition to routines that retrieve the data from the model. In general, the underlying data access technique should be encapsulated in the model. In this way, if an application is to be moved from a system that utilizes a flat file to store its information to as system that uses a database, the model is the only element that needs to be changed, not the view or the controller.

===View===
The view is the part of the component that is used to render the data from the model in a manner that is suitable for interaction. For a web-based application, the view would generally be an HTML page that is returned to the user. The view pulls data from the model (which is passed to it from the controller) and feeds the data into a template which is populated and presented to the user. The view does not cause the data to be modified in any way, it only displays the data received from the model.

===Controller===
The controller is responsible for responding to user actions. In the case of a web application, a user action is generally a page request. The controller will determine what request is being made by the user and respond appropriately by triggering the model to manipulate the data appropriately and passing the model into the view. The controller does not display the data in the model, it only triggers methods in the model which modify the data, and then pass the model into the view which displays the data.

== Joomla! Component Framework Explained ==

=== Model ===
In the Joomla framework, models are responsible for managing the data. The first function that has to be written for a model is a get function. It returns data to the caller. For this example, the caller will be the HelloWorldViewHelloWorld view. By default, the model named HelloWorldModelHelloWorld residing in site/models/helloworld.php is the main model associated to this view.

<translate>
So let's have a quick look at the naming conventions with an example, since the naming convention are the actual magic, that make everything work:</translate>

<translate>
The class ''HelloWorldView'''HelloWorld''''' resides in ''site/views/'''helloworld'''/view.html.php'' and will make use of the class ''HelloWorldModel'''HelloWorld''''' in the file ''site/models/'''helloworld'''.php''</translate>

<translate>
So let's just assume we want to use an imaginary view ''fluffy'', you would have to have:</translate>

<translate>
The class ''HelloWorldView'''Fluffy''''' which resides in ''site/views/'''fluffy'''/view.html.php''. The view will make use of ''HelloWorldModel'''Fluffy''''' in the file ''site/models/'''fluffy'''.php''. Note: the actual screen of the view: ''site/views/'''fluffy'''/tmpl/default.php'' is required as well to make this example work.</translate>

<translate>
Breaking any of these bold conventions will lead to errors or a blank page.</translate>

==Accessing a Joomlaǃ Component==
First we need to access the Joomla! platform, which is always accessed through a single point of entry. Using your preferred web browser, navigate to the following URL:

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php<tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php<tt>
|}

Hello World! example: <tt>localhost/joomla/index.php<tt>

You can use the URL of the component, or a [[#Menu| Menu]] in order to navigate to the component. In this article we will discuss using the URL.

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php?option=com_<component_name><tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php?option=com_<component_name><tt>
|}

Hello World! example: <tt>localhost/joomla/index.php?option=com_helloworld<tt>

==MVC Basic Directory Structure==
Components are stored in a directory within your Joomla! installation, specifically at:
*<tt><path_to_joomla>/htdocs/components/com_<component_name>/<tt> .

The Hello World! component would be stored in <tt> <path_to_joomla>/htdocs/components/com_helloworld/<tt>.

A basic component will contain the following files within its directoryː
*A html file that allows control of the background colorː <tt>index.html<tt>
*A php file that represents the controller itselfː <tt>controller.php<tt>
*A php file that loads the controller classː <tt><component_name>.php<tt>
*A php file that represents the model itselfː <tt>models/<component_name>.php<tt>
*Another html file for background controlː <tt>models/index.html<tt>
*A php file containing the default viewː <tt>views/<component_name>/tmpl/default.php<tt>
*A xml file for adding a menu item typeː <tt>views/<component_name>/tmpl/default.xml<tt>
*Another html file for background controlː <tt>views/<component_name>/tmpl/index.html<tt>
*Another html file for background controlː <tt>views/<component_name>/index.html<tt>
*A php file for displaying the viewː <tt>views/<component_name>/view.html.php<tt>

==JEXEC==
The following line is commonly found at the start of Joomla! PHP files:
<source lang="php">
<?php
defined('_JEXEC') or die('Restricted Access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

==Tutorials on Designing a MVC Component==
To learn how to design your own MVC Component, please complete the tutorial for your Joomla! version.
* [[J1.5:Developing_a_MVC_Component/Introduction| Joomla! 1.5]]
* [[J2.5:Developing_a_MVC_Component| Joomla! 2.5]]
* [[J3.x:Developing_an_MVC_Component/Introduction| Joomla! 3.x]]

==Contributors==
* [[User:Kevinkabatra|Kevin Kabatra]]

[[Category:Tutorials]]
[[Category:Explanations]]
[[Category:Component Development]]
[[Category:Beginner Development]]
[[Category:Development Recommended Reading]]

J3.x:Developing an MVC Component/Adding a model to the site part

2015-09-18T19:29:31Z

Kevinkabatra: /* File Details */ added section, moving all source code into this section

{{underconstruction}}

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

== Note ==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.zip archive]

== Adding a Model to Hello World! ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/models/test.php| test.php]]
| <tt><path_to_com_helloworld/site/models/test.php<tt>
|-
| 2
| Create: [[#site/models/index.html| index.html]]
| <tt><path_to_com_helloworld/site/models/index.html</tt>
|-
| 3
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

== File Details ==
{{vanchor|site/models/test.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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 string message
*/
protected $message;

/**
* Get the message
*
* @return string The message to be displayed to the user
*/
public function getMsg()
{
if (!isset($this->message))
{
$this->message = 'Hello World!';
}

return $this->message;
}
}
</source>

<translate>== Adding a model == </translate>
<translate>
In the Joomla framework, models are responsible for managing the data. The first function that has to be written for a model is a ''get'' function. It returns data to the caller. In our case, the caller will be the ''HelloWorldViewHelloWorld'' view. By default, the model named ''HelloWorldModelHelloWorld'' residing in ''site/models/helloworld.php'' is the main model associated to this view.</translate>

<translate>
So let's have a quick look at the naming conventions with an example, since the naming convention are the actual magic, that make everything work:</translate>

<translate>
The class ''HelloWorldView'''HelloWorld''''' resides in ''site/views/'''helloworld'''/view.html.php'' and will make use of the class ''HelloWorldModel'''HelloWorld''''' in the file ''site/models/'''helloworld'''.php''</translate>

<translate>
So let's just assume we want to use an imaginary view ''fluffy'', you would have to have:</translate>

<translate>
The class ''HelloWorldView'''Fluffy''''' which resides in ''site/views/'''fluffy'''/view.html.php''. The view will make use of ''HelloWorldModel'''Fluffy''''' in the file ''site/models/'''fluffy'''.php''. Note: the actual screen of the view: ''site/views/'''fluffy'''/tmpl/default.php'' is required as well to make this example work.</translate>

<translate>
Breaking any of these bold conventions will lead to errors or a blank page.</translate>

<translate>
So back to the actual implementation of the single classes:</translate>

<translate>
With your favourite file manager and editor put a ''site/models/helloworld.php'' file containing:</translate>

<translate>
The ''HelloWorldViewHelloWorld'' class asks the model for data using the ''get'' method of the ''JViewLegacy'' class:</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 - 2015 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->msg = $this->get('Msg');

// 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>
Note: $this->get() is a member of JViewLegacy::get which is a proxy to get* methods of the default model where * is populated with the value of the first parameter passed to get()</translate>

<translate>
Also modify your ''helloworld.xml'' file to indicate use of models and the new version:</translate>

<span id="helloworld.xml">
<tt>'''''helloworld.xml'''''</tt>

<source lang="xml" highlight="13,32">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.4</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

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

<translate>== Packaging the component == 


Content of your code directory</translate>
* ''[[#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_a_view_to_the_site_part#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/Adding_a_menu_type_to_the_site_part#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#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]]''
* ''[[#site/models/helloworld.php|site/models/helloworld.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/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''
<translate>
Create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.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>

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a menu type to the site part|Prev: Adding a menu type to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a variable request in the menu type|Next: Adding a variable request in the menu type</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a model to the site part

2015-09-18T19:24:40Z

Kevinkabatra: /* Adding a Model to Hello World! */

{{underconstruction}}

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

== Note ==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.zip archive]

== Adding a Model to Hello World! ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/models/test.php| test.php]]
| <tt><path_to_com_helloworld/site/models/test.php<tt>
|-
| 2
| Create: [[#site/models/index.html| index.html]]
| <tt><path_to_com_helloworld/site/models/index.html</tt>
|-
| 3
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

<translate>== Adding a model == </translate>
<translate>
In the Joomla framework, models are responsible for managing the data. The first function that has to be written for a model is a ''get'' function. It returns data to the caller. In our case, the caller will be the ''HelloWorldViewHelloWorld'' view. By default, the model named ''HelloWorldModelHelloWorld'' residing in ''site/models/helloworld.php'' is the main model associated to this view.</translate>

<translate>
So let's have a quick look at the naming conventions with an example, since the naming convention are the actual magic, that make everything work:</translate>

<translate>
The class ''HelloWorldView'''HelloWorld''''' resides in ''site/views/'''helloworld'''/view.html.php'' and will make use of the class ''HelloWorldModel'''HelloWorld''''' in the file ''site/models/'''helloworld'''.php''</translate>

<translate>
So let's just assume we want to use an imaginary view ''fluffy'', you would have to have:</translate>

<translate>
The class ''HelloWorldView'''Fluffy''''' which resides in ''site/views/'''fluffy'''/view.html.php''. The view will make use of ''HelloWorldModel'''Fluffy''''' in the file ''site/models/'''fluffy'''.php''. Note: the actual screen of the view: ''site/views/'''fluffy'''/tmpl/default.php'' is required as well to make this example work.</translate>

<translate>
Breaking any of these bold conventions will lead to errors or a blank page.</translate>

<translate>
So back to the actual implementation of the single classes:</translate>

<translate>
With your favourite file manager and editor put a ''site/models/helloworld.php'' file containing:</translate>

<span id="site/models/helloworld.php">
<tt>'''''site/models/helloworld.php'''''</tt>

<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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 string message
*/
protected $message;

/**
* Get the message
*
* @return string The message to be displayed to the user
*/
public function getMsg()
{
if (!isset($this->message))
{
$this->message = 'Hello World!';
}

return $this->message;
}
}
</source>
</span>

<translate>
The ''HelloWorldViewHelloWorld'' class asks the model for data using the ''get'' method of the ''JViewLegacy'' class:</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 - 2015 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->msg = $this->get('Msg');

// 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>
Note: $this->get() is a member of JViewLegacy::get which is a proxy to get* methods of the default model where * is populated with the value of the first parameter passed to get()</translate>

<translate>
Also modify your ''helloworld.xml'' file to indicate use of models and the new version:</translate>

<span id="helloworld.xml">
<tt>'''''helloworld.xml'''''</tt>

<source lang="xml" highlight="13,32">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.4</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

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

<translate>== Packaging the component == 


Content of your code directory</translate>
* ''[[#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_a_view_to_the_site_part#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/Adding_a_menu_type_to_the_site_part#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#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]]''
* ''[[#site/models/helloworld.php|site/models/helloworld.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/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''
<translate>
Create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.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>

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a menu type to the site part|Prev: Adding a menu type to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a variable request in the menu type|Next: Adding a variable request in the menu type</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a model to the site part

2015-09-18T19:12:49Z

Kevinkabatra: Added {{underconstruction}} tag, major revisions to article

{{underconstruction}}

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

== Note ==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.zip archive]

== Adding a Model to Hello World! ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

<translate>== Adding a model == </translate>
<translate>
In the Joomla framework, models are responsible for managing the data. The first function that has to be written for a model is a ''get'' function. It returns data to the caller. In our case, the caller will be the ''HelloWorldViewHelloWorld'' view. By default, the model named ''HelloWorldModelHelloWorld'' residing in ''site/models/helloworld.php'' is the main model associated to this view.</translate>

<translate>
So let's have a quick look at the naming conventions with an example, since the naming convention are the actual magic, that make everything work:</translate>

<translate>
The class ''HelloWorldView'''HelloWorld''''' resides in ''site/views/'''helloworld'''/view.html.php'' and will make use of the class ''HelloWorldModel'''HelloWorld''''' in the file ''site/models/'''helloworld'''.php''</translate>

<translate>
So let's just assume we want to use an imaginary view ''fluffy'', you would have to have:</translate>

<translate>
The class ''HelloWorldView'''Fluffy''''' which resides in ''site/views/'''fluffy'''/view.html.php''. The view will make use of ''HelloWorldModel'''Fluffy''''' in the file ''site/models/'''fluffy'''.php''. Note: the actual screen of the view: ''site/views/'''fluffy'''/tmpl/default.php'' is required as well to make this example work.</translate>

<translate>
Breaking any of these bold conventions will lead to errors or a blank page.</translate>

<translate>
So back to the actual implementation of the single classes:</translate>

<translate>
With your favourite file manager and editor put a ''site/models/helloworld.php'' file containing:</translate>

<span id="site/models/helloworld.php">
<tt>'''''site/models/helloworld.php'''''</tt>

<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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 string message
*/
protected $message;

/**
* Get the message
*
* @return string The message to be displayed to the user
*/
public function getMsg()
{
if (!isset($this->message))
{
$this->message = 'Hello World!';
}

return $this->message;
}
}
</source>
</span>

<translate>
The ''HelloWorldViewHelloWorld'' class asks the model for data using the ''get'' method of the ''JViewLegacy'' class:</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 - 2015 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->msg = $this->get('Msg');

// 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>
Note: $this->get() is a member of JViewLegacy::get which is a proxy to get* methods of the default model where * is populated with the value of the first parameter passed to get()</translate>

<translate>
Also modify your ''helloworld.xml'' file to indicate use of models and the new version:</translate>

<span id="helloworld.xml">
<tt>'''''helloworld.xml'''''</tt>

<source lang="xml" highlight="13,32">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.4</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

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

<translate>== Packaging the component == 


Content of your code directory</translate>
* ''[[#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_a_view_to_the_site_part#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/Adding_a_menu_type_to_the_site_part#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#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]]''
* ''[[#site/models/helloworld.php|site/models/helloworld.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/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''
<translate>
Create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.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>

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a menu type to the site part|Prev: Adding a menu type to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a variable request in the menu type|Next: Adding a variable request in the menu type</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

Absolute Basics of How a Component Functions

2015-09-18T19:06:39Z

Kevinkabatra: /* Joomla! Component Framework Explained */ added section, Added information on the Joomla! framework, removing it from https://docs.joomla.org/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part

This article is designed for Joomlaǃ beginners; it is designed to explain what a Joomlaǃ component is, and how it functions. When a specific component example will benefit the tutorial, this article will refer to an example component named Hello Worldǃ.

==What is a Joomlaǃ Component==
A component is a kind of Joomla! extension. Components are the main functional units of Joomla!; they can be seen as mini-applications. An easy analogy would be that Joomla! is the operating system and the components are desktop applications. Created by a component, content is usually displayed in the center of the main content area of a template (depending on the template).

Most components have two main parts: an administrator part and a site part. The site part is what is used to render pages of your site when they are requested by your site visitors during normal site operation. The administrator part provides an interface to configure and manage different aspects of the component and is accessible through the Joomla! administrator application.

In the Joomla! framework, components can be designed using a flat model(returns HTML code for the requested page) or Model-View-Controller (herein referred to as MVC) pattern.

==Introduction to MVC==
MVC is a software design pattern that can be used to organize code in such a way that the business logic and data presentation are seperate. The premise behind this approach is that if the business logic is grouped into one section, then the interface and user interaction that surrounds the data can be revised and customized without having to reprogram the business logic. MVC was originally developed to map the traditional input, processing, output roles into a logical GUI architecture.

===Model===
The model is the part of the component that encapsulates the application's data. It will often provide routines to manage and manipulate this data in a meaningful way in addition to routines that retrieve the data from the model. In general, the underlying data access technique should be encapsulated in the model. In this way, if an application is to be moved from a system that utilizes a flat file to store its information to as system that uses a database, the model is the only element that needs to be changed, not the view or the controller.

===View===
The view is the part of the component that is used to render the data from the model in a manner that is suitable for interaction. For a web-based application, the view would generally be an HTML page that is returned to the user. The view pulls data from the model (which is passed to it from the controller) and feeds the data into a template which is populated and presented to the user. The view does not cause the data to be modified in any way, it only displays the data received from the model.

===Controller===
The controller is responsible for responding to user actions. In the case of a web application, a user action is generally a page request. The controller will determine what request is being made by the user and respond appropriately by triggering the model to manipulate the data appropriately and passing the model into the view. The controller does not display the data in the model, it only triggers methods in the model which modify the data, and then pass the model into the view which displays the data.

== Joomla! Component Framework Explained ==

=== Model ===
In the Joomla framework, models are responsible for managing the data. The first function that has to be written for a model is a get function. It returns data to the caller. For this example, the caller will be the HelloWorldViewHelloWorld view. By default, the model named HelloWorldModelHelloWorld residing in site/models/helloworld.php is the main model associated to this view.

So let's have a quick look at the naming conventions with an example, since the naming convention are the actual magic, that make everything work:

The class HelloWorldViewHelloWorld resides in site/views/helloworld/view.html.php and will make use of the class HelloWorldModelHelloWorld in the file site/models/helloworld.php

So let's just assume we want to use an imaginary view fluffy, you would have to have:

The class HelloWorldViewFluffy which resides in site/views/fluffy/view.html.php. The view will make use of HelloWorldModelFluffy in the file site/models/fluffy.php. Note: the actual screen of the view: site/views/fluffy/tmpl/default.php is required as well to make this example work.

Breaking any of these bold conventions will lead to errors or a blank page.

==Accessing a Joomlaǃ Component==
First we need to access the Joomla! platform, which is always accessed through a single point of entry. Using your preferred web browser, navigate to the following URL:

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php<tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php<tt>
|}

Hello World! example: <tt>localhost/joomla/index.php<tt>

You can use the URL of the component, or a [[#Menu| Menu]] in order to navigate to the component. In this article we will discuss using the URL.

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php?option=com_<component_name><tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php?option=com_<component_name><tt>
|}

Hello World! example: <tt>localhost/joomla/index.php?option=com_helloworld<tt>

==MVC Basic Directory Structure==
Components are stored in a directory within your Joomla! installation, specifically at:
*<tt><path_to_joomla>/htdocs/components/com_<component_name>/<tt> .

The Hello World! component would be stored in <tt> <path_to_joomla>/htdocs/components/com_helloworld/<tt>.

A basic component will contain the following files within its directoryː
*A html file that allows control of the background colorː <tt>index.html<tt>
*A php file that represents the controller itselfː <tt>controller.php<tt>
*A php file that loads the controller classː <tt><component_name>.php<tt>
*A php file that represents the model itselfː <tt>models/<component_name>.php<tt>
*Another html file for background controlː <tt>models/index.html<tt>
*A php file containing the default viewː <tt>views/<component_name>/tmpl/default.php<tt>
*A xml file for adding a menu item typeː <tt>views/<component_name>/tmpl/default.xml<tt>
*Another html file for background controlː <tt>views/<component_name>/tmpl/index.html<tt>
*Another html file for background controlː <tt>views/<component_name>/index.html<tt>
*A php file for displaying the viewː <tt>views/<component_name>/view.html.php<tt>

==JEXEC==
The following line is commonly found at the start of Joomla! PHP files:
<source lang="php">
<?php
defined('_JEXEC') or die('Restricted Access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

==Tutorials on Designing a MVC Component==
To learn how to design your own MVC Component, please complete the tutorial for your Joomla! version.
* [[J1.5:Developing_a_MVC_Component/Introduction| Joomla! 1.5]]
* [[J2.5:Developing_a_MVC_Component| Joomla! 2.5]]
* [[J3.x:Developing_an_MVC_Component/Introduction| Joomla! 3.x]]

==Contributors==
* [[User:Kevinkabatra|Kevin Kabatra]]

[[Category:Tutorials]]
[[Category:Explanations]]
[[Category:Component Development]]
[[Category:Beginner Development]]
[[Category:Development Recommended Reading]]

Absolute Basics of How a Component Functions

2015-09-18T18:56:28Z

Kevinkabatra:

This article is designed for Joomlaǃ beginners; it is designed to explain what a Joomlaǃ component is, and how it functions. When a specific component example will benefit the tutorial, this article will refer to an example component named Hello Worldǃ.

==What is a Joomlaǃ Component==
A component is a kind of Joomla! extension. Components are the main functional units of Joomla!; they can be seen as mini-applications. An easy analogy would be that Joomla! is the operating system and the components are desktop applications. Created by a component, content is usually displayed in the center of the main content area of a template (depending on the template).

Most components have two main parts: an administrator part and a site part. The site part is what is used to render pages of your site when they are requested by your site visitors during normal site operation. The administrator part provides an interface to configure and manage different aspects of the component and is accessible through the Joomla! administrator application.

In the Joomla! framework, components can be designed using a flat model(returns HTML code for the requested page) or Model-View-Controller (herein referred to as MVC) pattern.

==Introduction to MVC==
MVC is a software design pattern that can be used to organize code in such a way that the business logic and data presentation are seperate. The premise behind this approach is that if the business logic is grouped into one section, then the interface and user interaction that surrounds the data can be revised and customized without having to reprogram the business logic. MVC was originally developed to map the traditional input, processing, output roles into a logical GUI architecture.

===Model===
The model is the part of the component that encapsulates the application's data. It will often provide routines to manage and manipulate this data in a meaningful way in addition to routines that retrieve the data from the model. In general, the underlying data access technique should be encapsulated in the model. In this way, if an application is to be moved from a system that utilizes a flat file to store its information to as system that uses a database, the model is the only element that needs to be changed, not the view or the controller.

===View===
The view is the part of the component that is used to render the data from the model in a manner that is suitable for interaction. For a web-based application, the view would generally be an HTML page that is returned to the user. The view pulls data from the model (which is passed to it from the controller) and feeds the data into a template which is populated and presented to the user. The view does not cause the data to be modified in any way, it only displays the data received from the model.

===Controller===
The controller is responsible for responding to user actions. In the case of a web application, a user action is generally a page request. The controller will determine what request is being made by the user and respond appropriately by triggering the model to manipulate the data appropriately and passing the model into the view. The controller does not display the data in the model, it only triggers methods in the model which modify the data, and then pass the model into the view which displays the data.

==Accessing a Joomlaǃ Component==
First we need to access the Joomla! platform, which is always accessed through a single point of entry. Using your preferred web browser, navigate to the following URL:

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php<tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php<tt>
|}

Hello World! example: <tt>localhost/joomla/index.php<tt>

You can use the URL of the component, or a [[#Menu| Menu]] in order to navigate to the component. In this article we will discuss using the URL.

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php?option=com_<component_name><tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php?option=com_<component_name><tt>
|}

Hello World! example: <tt>localhost/joomla/index.php?option=com_helloworld<tt>

==MVC Basic Directory Structure==
Components are stored in a directory within your Joomla! installation, specifically at:
*<tt><path_to_joomla>/htdocs/components/com_<component_name>/<tt> .

The Hello World! component would be stored in <tt> <path_to_joomla>/htdocs/components/com_helloworld/<tt>.

A basic component will contain the following files within its directoryː
*A html file that allows control of the background colorː <tt>index.html<tt>
*A php file that represents the controller itselfː <tt>controller.php<tt>
*A php file that loads the controller classː <tt><component_name>.php<tt>
*A php file that represents the model itselfː <tt>models/<component_name>.php<tt>
*Another html file for background controlː <tt>models/index.html<tt>
*A php file containing the default viewː <tt>views/<component_name>/tmpl/default.php<tt>
*A xml file for adding a menu item typeː <tt>views/<component_name>/tmpl/default.xml<tt>
*Another html file for background controlː <tt>views/<component_name>/tmpl/index.html<tt>
*Another html file for background controlː <tt>views/<component_name>/index.html<tt>
*A php file for displaying the viewː <tt>views/<component_name>/view.html.php<tt>

==JEXEC==
The following line is commonly found at the start of Joomla! PHP files:
<source lang="php">
<?php
defined('_JEXEC') or die('Restricted Access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

==Tutorials on Designing a MVC Component==
To learn how to design your own MVC Component, please complete the tutorial for your Joomla! version.
* [[J1.5:Developing_a_MVC_Component/Introduction| Joomla! 1.5]]
* [[J2.5:Developing_a_MVC_Component| Joomla! 2.5]]
* [[J3.x:Developing_an_MVC_Component/Introduction| Joomla! 3.x]]

==Contributors==
* [[User:Kevinkabatra|Kevin Kabatra]]

[[Category:Tutorials]]
[[Category:Explanations]]
[[Category:Component Development]]
[[Category:Beginner Development]]
[[Category:Development Recommended Reading]]

J3.x:Developing an MVC Component/Adding a model to the site part

2015-09-18T18:52:27Z

Kevinkabatra: /* Notes */ added section.

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.zip archive]

<translate>== Adding a model == </translate>
<translate>
In the Joomla framework, models are responsible for managing the data. The first function that has to be written for a model is a ''get'' function. It returns data to the caller. In our case, the caller will be the ''HelloWorldViewHelloWorld'' view. By default, the model named ''HelloWorldModelHelloWorld'' residing in ''site/models/helloworld.php'' is the main model associated to this view.</translate>

<translate>
So let's have a quick look at the naming conventions with an example, since the naming convention are the actual magic, that make everything work:</translate>

<translate>
The class ''HelloWorldView'''HelloWorld''''' resides in ''site/views/'''helloworld'''/view.html.php'' and will make use of the class ''HelloWorldModel'''HelloWorld''''' in the file ''site/models/'''helloworld'''.php''</translate>

<translate>
So let's just assume we want to use an imaginary view ''fluffy'', you would have to have:</translate>

<translate>
The class ''HelloWorldView'''Fluffy''''' which resides in ''site/views/'''fluffy'''/view.html.php''. The view will make use of ''HelloWorldModel'''Fluffy''''' in the file ''site/models/'''fluffy'''.php''. Note: the actual screen of the view: ''site/views/'''fluffy'''/tmpl/default.php'' is required as well to make this example work.</translate>

<translate>
Breaking any of these bold conventions will lead to errors or a blank page.</translate>

<translate>
So back to the actual implementation of the single classes:</translate>

<translate>
With your favourite file manager and editor put a ''site/models/helloworld.php'' file containing:</translate>

<span id="site/models/helloworld.php">
<tt>'''''site/models/helloworld.php'''''</tt>

<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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 string message
*/
protected $message;

/**
* Get the message
*
* @return string The message to be displayed to the user
*/
public function getMsg()
{
if (!isset($this->message))
{
$this->message = 'Hello World!';
}

return $this->message;
}
}
</source>
</span>

<translate>
The ''HelloWorldViewHelloWorld'' class asks the model for data using the ''get'' method of the ''JViewLegacy'' class:</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 - 2015 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->msg = $this->get('Msg');

// 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>
Note: $this->get() is a member of JViewLegacy::get which is a proxy to get* methods of the default model where * is populated with the value of the first parameter passed to get()</translate>

<translate>
Also modify your ''helloworld.xml'' file to indicate use of models and the new version:</translate>

<span id="helloworld.xml">
<tt>'''''helloworld.xml'''''</tt>

<source lang="xml" highlight="13,32">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.4</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

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

<translate>== Packaging the component == 


Content of your code directory</translate>
* ''[[#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_a_view_to_the_site_part#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/Adding_a_menu_type_to_the_site_part#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Adding_a_view_to_the_site_part#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]]''
* ''[[#site/models/helloworld.php|site/models/helloworld.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/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''
<translate>
Create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-4-adding-a-site-model.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>

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a menu type to the site part|Prev: Adding a menu type to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding a variable request in the menu type|Next: Adding a variable request in the menu type</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T18:46:09Z

Kevinkabatra: /* Adding a Menu Item to Hello World */ improved tutorial on how to add menu item

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

With the component successfully updated, we need to add the Menu Item. This will be done by using the Menu Manager of Joomla!.

*Using your preferred web browser, navigate to the Administrator panel of your Joomla! site. The address would be <tt><yoursite>/joomla/administrator/index.php</tt>. For this example we will navigate to <tt>localhost/joomla/administrator/index.php</tt>.
*Click Menu {{rarr}} Manage {{rarr}} Menu Items {{rarr}} New {{rarr}} Select
*Navigate and Choose <tt>Hello World!</tt>
*Navigate and Choose <tt>COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLLE</tt>
*Click Menu Title and enter <tt>Hello World!</tt>
*Click Save & Close

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===

Note - For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===

<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|} </translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T18:35:57Z

Kevinkabatra: /* Component Contents */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===

Note - For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===

<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|} </translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T18:35:37Z

Kevinkabatra: /* Component Contents */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===

Note - For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===

<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}
</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T18:35:18Z

Kevinkabatra: /* Component Contents */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===

Note - For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===

<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

JDOC talk:Developer Tutorials Project

2015-09-18T18:32:33Z

Kevinkabatra: /* Developer Tutorials Project */

==Developer Tutorials Project==
* [[User:Hutchy68|Tom Hutchison]] ([[User talk:Hutchy68|talk]]) 09:37, 11 February 2013 (CST) - page categorisation, wiki markup help, layout, wikification of related pages
* [[User:Kevinkabatra|Kevinkabatra]] ([[User talk:Kevinkabatra|talk]]) 13:32, 18 September 2015 (CDT) - updating current beginner tutorials to be actually geared toward beginners, anything else that is needed

== Feedback and ideas ==



* [[User:Poproar|popROAR]] ([[User talk:Poproar|talk]]) 12:22, 4 August 2013 (CDT) - walkthroughs?

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T18:13:15Z

Kevinkabatra: /* helloworld.xml */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===

Note - For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===

<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T18:13:00Z

Kevinkabatra: /* default.xml */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===

Note - For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T18:09:43Z

Kevinkabatra: /* Adding a Menu Item to Hello World */ fixed typo

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T18:09:19Z

Kevinkabatra: /* Adding a View to Hello World! */ fixed typo

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/</tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== helloworld.php ===
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

=== controller.php ===

<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

=== view.html.php ===

<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

=== default.php ===

<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

=== helloworld.xml ===

<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T17:52:28Z

Kevinkabatra: /* Code Explanation */ added new section, moved all code explanation into the section

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

=== helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== Component Contents ==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T17:49:49Z

Kevinkabatra: /* Adding a Menu Item to Hello World */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a menu item you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. You must use the updated directory structure from the last [[J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part | tutorial]]. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_com_helloworld/site/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

=== Create default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

Absolute Basics of How a Component Functions

2015-09-18T17:40:38Z

Kevinkabatra: /* Accessing a Joomlaǃ Component */ added information about Menu, as I am removing the information from https://docs.joomla.org/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part

This article is designed for Joomlaǃ beginners; it is designed to explain what a Joomlaǃ component is, and how it functions. When a specific component example will benefit the tutorial, this article will refer to an example component named Hello Worldǃ.

==What is a Joomlaǃ Component==
A component is a kind of Joomla! extension. Components are the main functional units of Joomla!; they can be seen as mini-applications. An easy analogy would be that Joomla! is the operating system and the components are desktop applications. Created by a component, content is usually displayed in the center of the main content area of a template (depending on the template).

Most components have two main parts: an administrator part and a site part. The site part is what is used to render pages of your site when they are requested by your site visitors during normal site operation. The administrator part provides an interface to configure and manage different aspects of the component and is accessible through the Joomla! administrator application.

In the Joomla! framework, components can be designed using a flat model(returns HTML code for the requested page) or Model-View-Controller (herein referred to as MVC) pattern.

==Accessing a Joomlaǃ Component==
First we need to access the Joomla! platform, which is always accessed through a single point of entry. Using your preferred web browser, navigate to the following URL:

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php<tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php<tt>
|}

Hello World! example: <tt>localhost/joomla/index.php<tt>

You can use the URL of the component, or a [[#Menu| Menu]] in order to navigate to the component. In this article we will discuss using the URL.

{| border=1
| 1
| user access
| <tt><yoursite>/joomla/index.php?option=com_<component_name><tt>
|-
| 2
| administrator access
| <tt><yoursite>/joomla/administrator/index.php?option=com_<component_name><tt>
|}

Hello World! example: <tt>localhost/joomla/index.php?option=com_helloworld<tt>

==Introduction to MVC==
MVC is a software design pattern that can be used to organize code in such a way that the business logic and data presentation are seperate. The premise behind this approach is that if the business logic is grouped into one section, then the interface and user interaction that surrounds the data can be revised and customized without having to reprogram the business logic. MVC was originally developed to map the traditional input, processing, output roles into a logical GUI architecture.

===Model===
The model is the part of the component that encapsulates the application's data. It will often provide routines to manage and manipulate this data in a meaningful way in addition to routines that retrieve the data from the model. In general, the underlying data access technique should be encapsulated in the model. In this way, if an application is to be moved from a system that utilizes a flat file to store its information to as system that uses a database, the model is the only element that needs to be changed, not the view or the controller.

===View===
The view is the part of the component that is used to render the data from the model in a manner that is suitable for interaction. For a web-based application, the view would generally be an HTML page that is returned to the user. The view pulls data from the model (which is passed to it from the controller) and feeds the data into a template which is populated and presented to the user. The view does not cause the data to be modified in any way, it only displays the data received from the model.

===Controller===
The controller is responsible for responding to user actions. In the case of a web application, a user action is generally a page request. The controller will determine what request is being made by the user and respond appropriately by triggering the model to manipulate the data appropriately and passing the model into the view. The controller does not display the data in the model, it only triggers methods in the model which modify the data, and then pass the model into the view which displays the data.

==MVC Basic Directory Structure==
Components are stored in a directory within your Joomla! installation, specifically at:
*<tt><path_to_joomla>/htdocs/components/com_<component_name>/<tt> .

The Hello World! component would be stored in <tt> <path_to_joomla>/htdocs/components/com_helloworld/<tt>.

A basic component will contain the following files within its directoryː
*A html file that allows control of the background colorː <tt>index.html<tt>
*A php file that represents the controller itselfː <tt>controller.php<tt>
*A php file that loads the controller classː <tt><component_name>.php<tt>
*A php file that represents the model itselfː <tt>models/<component_name>.php<tt>
*Another html file for background controlː <tt>models/index.html<tt>
*A php file containing the default viewː <tt>views/<component_name>/tmpl/default.php<tt>
*A xml file for adding a menu item typeː <tt>views/<component_name>/tmpl/default.xml<tt>
*Another html file for background controlː <tt>views/<component_name>/tmpl/index.html<tt>
*Another html file for background controlː <tt>views/<component_name>/index.html<tt>
*A php file for displaying the viewː <tt>views/<component_name>/view.html.php<tt>

==JEXEC==
The following line is commonly found at the start of Joomla! PHP files:
<source lang="php">
<?php
defined('_JEXEC') or die('Restricted Access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

==Tutorials on Designing a MVC Component==
To learn how to design your own MVC Component, please complete the tutorial for your Joomla! version.
* [[J1.5:Developing_a_MVC_Component/Introduction| Joomla! 1.5]]
* [[J2.5:Developing_a_MVC_Component| Joomla! 2.5]]
* [[J3.x:Developing_an_MVC_Component/Introduction| Joomla! 3.x]]

==Contributors==
* [[User:Kevinkabatra|Kevin Kabatra]]

[[Category:Tutorials]]
[[Category:Explanations]]
[[Category:Component Development]]
[[Category:Beginner Development]]
[[Category:Development Recommended Reading]]

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-18T17:31:10Z

Kevinkabatra: /* Adding a Menu Item to Hello World */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. As with the last tutorial, we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

=== Create default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T17:28:58Z

Kevinkabatra: Added git request

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== helloworld.php ===
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

=== controller.php ===

<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

=== view.html.php ===

<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

=== default.php ===

<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

=== helloworld.xml ===

<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T17:21:31Z

Kevinkabatra: /* Code Explanation */ added new section, moved all code explanation into the section

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Code Explanation ==
In case you were curious as to why this works the way it does.

=== helloworld.php ===
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

=== controller.php ===

<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

=== view.html.php ===

<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

=== default.php ===

<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

=== helloworld.xml ===

<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T17:16:30Z

Kevinkabatra: /* Adding a View to Hello World! */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. Using your preferred file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T17:16:04Z

Kevinkabatra: /* Adding a View to Hello World! */ fixed typo

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to navigate to <tt>com_helloworld</tt>, which is the original directory we made for our component. Using your favorite file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T17:15:23Z

Kevinkabatra: /* Adding a View to Hello World! */ expanded instructions

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to navigate to <tt>com_helloworld<tt>, which is the original directory we made for our component. Using your favorite file manager, create or update the following files; as you create or update the files, add the source code for each file which is found in [[#File Details|File Details]].

{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

=== Updating the Hello World! Component ===
To update the Hello World! Component in the Joomla! website, please follow the same steps for the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component#Installing the Hello World! Component |original installation]].

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Developing a Basic Component

2015-09-18T17:10:13Z

Kevinkabatra: /* How to add a component to Joomla! */ minor update

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

<translate>
== Notes ==
* 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.

* If you have used Joomla! before reading this tutorial, you have noticed that extensions are installed using a compressed file containing all the things which are needed for installing and uninstalling them.

* You can follow the steps below to create the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-1-basic-component.zip archive]

== How to add a component to Joomla! ==
In this article we will cover how to create and install a basic Joomla! component. For this example we will be working with the Hello World! component.

To begin, you must first use your preferred file manager to create a directory for the Hello World! component. This directory can be anywhere on your file system, as long as it outside of your Joomla! installation directory. For this example we will name the directory <tt>com_helloworld</tt>, but this directory can be named anything.

Next, inside this directory we need to create some files. Using your preferred file manager, create the following files; as you create the files, add the source code for each file which is found in ''[[#File Details| File Details]]''.

{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 5
| ''[[#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 6
| ''[[#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 8
| ''[[#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

=== Installing the Hello World! Component ===
Using your preferred file manager, create a .zip file of this directory. For this example we will name the file <tt>com_helloworld.zip</tt>, again this file could have been named anything.

Now we need to install the Hello World! component. There are two ways to do this, both are covered in [[Installing an extension| Installing an Extension]]. Here we will cover the method using the Extension Manager of Joomla!.

*Using your preferred web browser, navigate to the Administrator panel of your Joomla! site. The address would be <tt><yoursite>/joomla/administrator/index.php</tt>. For this example we will navigate to <tt>localhost/joomla/administrator/index.php</tt>.
*Click Extensions {{rarr}} Manage {{rarr}} Install {{rarr}} Upload Package File {{rarr}} Choose File
*Navigate and Select File
*Click Upload & Install

Note - You should see a message letting you know if the installation succeeded or failed.

You can test this basic function of the component by entering the Hello World! page for the site and administrator portions of your Joomla! website.
* Using your preferred web browser, navigate to the Hello World! component page located on the site portion of your website. The address would be <tt><yoursite>/joomla/index.php?option=com_helloworld</tt>. For this example we will navigate to <tt>localhost/joomla/index.php?option=com_helloworld</tt>.
* Using your preferred web browser, navigate to the Hello World! component page located on the administrator portion of your website. The address would be <tt><yoursite>/joomla/administrator/index.php?option=com_helloworld</tt>. For this example we will navigate to <tt>localhost/joomla/administrator/index.php?option=com_helloworld</tt>.

You can also notice that the ''Hello World!'' component is visible in the administrator site of your Joomla installation under the ''Components'' menu.

==File Details== 
</translate>
{{vanchor|admin/sql/updates/mysql/0.0.1.sql}}
<translate>
is an empty file allowing to initialise schema version of the com_helloworld component.</translate>

<source lang="sql">
</source>

{{vanchor|helloworld.xml}}

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

<name>Hello World!</name>

<creationDate>December 2013</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.1</version>

<description>Description of the Hello World component ...</description>

<update> 
<schemas>
<schemapath type="mysql">sql/updates/mysql</schemapath>
</schemas>
</update>



<files folder="site">
<filename>index.html</filename>
<filename>helloworld.php</filename>
</files>

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

{{vanchor|site/helloworld.php}}

<source lang="php">
Hello World
</source>

{{vanchor|admin/helloworld.php}}

<source lang="php">
Hello World administration
</source>

{{vanchor|index.html}}

<translate>
common to all folders</translate>

<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 5
| ''[[#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 6
| ''[[#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 8
| ''[[#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

== Contributors ==
* [[User:Ribafs|Ribafs]]
* [[User:Cdemko|Christophe Demko]]
* [[User:Kevinkabatra|Kevin Kabatra]]

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Introduction|Prev: Introduction</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Next: Adding a view to the site part</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T16:52:47Z

Kevinkabatra: /* Adding a View to Hello World! */ updated links

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T16:51:48Z

Kevinkabatra: /* File Details */ added code for index.html

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#site/views/helloworld/tmpl/index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|index.html}}
Note - the same code is used for all folders
<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-18T16:50:29Z

Kevinkabatra: /* Adding a View to Hello World! */ added information for how to actually update a Joomla! website. Expanded tutorial steps to include index.html creations.

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
In this article we will cover how to add a view to a basic Joomla! component. For this example we will be continuing our work on the [[J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component| Hello World!]] component.

There are several ways to update a Joomla! component. In this tutorial we will focus option 2.
{| border=1
| 1
| Manually add the files into <tt><path_to_joomla>/<tt>
|-
| 2
| Update using the Joomla! Extension Manager and the original directory, non-compressed, used for the component install
|-
|3
| Update using the Joomla! Extension Manager and an [[Deploying_an_Update_Server| Update Server]]
|}

To add a view you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_com_helloworld>/site/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_com_helloworld>/site/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_com_helloworld>/site/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/index.html</tt>
|-
| 5
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 6
| Create: [[#site/views/helloworld/tmpl/index.html| index.html]]
| <tt><path_to_com_helloworld>/site/views/helloworld/tmpl/index.html</tt>
|-
| 7
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-17T21:15:41Z

Kevinkabatra: /* Component Contents */ updated section

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

=== Create default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
| file that adds menu item
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 16
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-17T21:08:52Z

Kevinkabatra: /* Update helloworld.xml */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

=== Create default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.3</version>
</source>

Updates the version number

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-17T21:08:23Z

Kevinkabatra: /* File Details */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

=== Create default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-17T21:07:29Z

Kevinkabatra: Major revision. Re-designed article to follow tutorial patterns.

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Adding a Menu Item to Hello World ==
In the Joomla! framework, components are executed using menu items. These items are links on your Joomla! page, that open a specific page of your component. To add a menu item you will need to:

{| border=1
| 1
| Create: [[#site/views/helloworld/tmpl/default.xml| default.xml]]
| <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml<tt>
|-
| 2
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

=== Create default.xml ===
Using your preferred file editor, create <tt><path_to_joomla>htdocs/components/com_helloworld/views/helloworld/tmpl/default.xml</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

== File Details ==
{{vanchor|site/views/helloworld/tml/default.xml}}
<source lang="xml>
<?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>
</metadata>
</source>

For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">
<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>
</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

You can add a menu item of this component using the menu manager in the backend. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>

== Contributors ==
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a menu type to the site part

2015-09-17T20:44:12Z

Kevinkabatra: /* Notes */ added section

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.zip archive]

== Abstract == 
Generally speaking, this article describes how to get a link on your joomla page to open a specific page of your component. This gets simply done by adding an xml file to your specific page into your view folder.</translate>

<translate>
E.g.</translate>

<tt>site/views/helloworld/tmpl/</tt>

<translate>
Contains your view page <tt>default.php</tt> that we want to open.</translate>

<translate>
A file <tt>default.xml</tt> is placed next to this file with some xml. This makes joomla able to recognize the view file <tt>default.php</tt> as a menu item.
</translate>

<translate>== Adding a menu item type == 
In the Joomla framework, components are executed using menu items. If you go in the menu manager of your Joomla installation a ''HelloWorld'' menu item type does not yet exist. Adding this functionality is easy in Joomla. Simply put a <tt>site/views/helloworld/tmpl/default.xml</tt> file containing:</translate>

<span id="site/views/helloworld/tmpl/default.xml">
'''''site/views/helloworld/tmpl/default.xml'''''
<source lang="xml">
<?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>
</metadata>
</source>
</span>

<translate>
For the moment the strings won't be translated in the administrator interface. We will see in a later article how translation is performed.</translate>

<translate>
Also modify your <tt>helloworld.xml</tt> file to indicate a new version:</translate>

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

<name>Hello World!</name>

<creationDate>January 2014</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.3</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

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

<translate>== Packaging the component == </translate>
<translate>
Content of your code directory</translate>

* ''[[#helloworld.xml|helloworld.xml]]''
* ''[[#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[#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]]''
* ''[[#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]]''
* ''[[#site/views/helloworld/tmpl/default.xml|site/views/helloworld/tmpl/default.xml]]''
* ''[[#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|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
* ''[[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]]''

<translate>
If you haven't already done so from the previous lessons, create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-3-adding-a-site-menu.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. To do so select "Add New Menu Item" from the one of the menus in the "Menus" menu; then you can select COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE for Menu Item Type. Once selected you can see the Link information is populated with the URL for the view.</translate>
[[File:Com_helloworld_v3-0.0.3.png|thumb|center|400px|<translate>
Selecting the Menu Item Type</translate>]]
{{-}}
{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>== Contributors == </translate>
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Jossnaz|Lukas Meier]]
*[[User:betweenbrain|Matt Thomas]]
*[[User:Scionescire|Scionescire]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Prev: Adding a view to the site part</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_model_to_the_site_part|Next: Adding a model to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T20:22:22Z

Kevinkabatra: Removed review tag. If further updates are needed, feel free to update or post in talk section with request.

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:34:31Z

Kevinkabatra: /* File Details */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:33:46Z

Kevinkabatra: /* File Details */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="all">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:31:59Z

Kevinkabatra: /* File Details */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php" highlight="1">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:30:24Z

Kevinkabatra: /* Component Contents */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
| file representing the controller
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
| file representing the view
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
| the default view
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:28:44Z

Kevinkabatra: /* Component Contents */ added section

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#site/controller.php|site/controller.php]]''
|
|-
| 5
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/index.html]]''
| prevents web server from listing directory content
|-
| 6
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#site/views/helloworld/view.html.php|site/views/helloworld/view.html.php]]''
|
|-
| 8
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/views/helloworld/tmpl/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#site/views/helloworld/tmpl/default.php|site/views/helloworld/tmpl/default.php]]''
|
|-
| 10
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 11
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 12
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 13
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 14
| ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 15
| ''[[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]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

==Contributors==
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</noinclude>

J3.x:Developing an MVC Component/Developing a Basic Component

2015-09-17T19:13:04Z

Kevinkabatra: /* Component Contents */ added section, this section will become useful later in the tutorial

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

<translate>
== Notes ==
* 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.

* If you have used Joomla! before reading this tutorial, you have noticed that extensions are installed using a compressed file containing all the things which are needed for installing and uninstalling them.

* You can follow the steps below to create the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-1-basic-component.zip archive]

== How to add a component to Joomla! ==
In this article we will cover how to create and install a basic Joomla! component. For this example we will be working with the Hello World! component.

To begin, you must first use your preferred file manager to create a directory for the Hello World! component. This directory can be anywhere on your file system, as long as it outside of your Joomla! installation directory. For this example we will name the directory <tt>com_helloworld</tt>, but this directory can be named anything.

Next, inside this directory we need to create some files. Using your preferred file manager, create the following files; as you create the files, add the source code for each file which is found in ''[[#File Details| File Details]]''.

{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 5
| ''[[#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 6
| ''[[#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 8
| ''[[#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

Using your preferred file manager, create a .zip file of this directory. For this example we will name the file <tt>com_helloworld.zip</tt>, again this file could have been named anything.

Now we need to install the Hello World! component. There are two ways to do this, both are covered in [[Installing an extension| Installing an Extension]]. Here we will cover the method using the Extension Manager of Joomla!.

*Using your preferred web browser, navigate to the Administrator panel of your Joomla! site. The address would be <tt><yoursite>/joomla/administrator/index.php</tt>. For this example we will navigate to <tt>localhost/joomla/administrator/index.php</tt>.
*Click Extensions {{rarr}} Manage {{rarr}} Install {{rarr}} Upload Package File {{rarr}} Choose File
*Navigate and Select File
*Click Upload & Install

Note - You should see a message letting you know if the installation succeeded or failed.

You can test this basic function of the component by entering the Hello World! page for the site and administrator portions of your Joomla! website.
* Using your preferred web browser, navigate to the Hello World! component page located on the site portion of your website. The address would be <tt><yoursite>/joomla/index.php?option=com_helloworld</tt>. For this example we will navigate to <tt>localhost/joomla/index.php?option=com_helloworld</tt>.
* Using your preferred web browser, navigate to the Hello World! component page located on the administrator portion of your website. The address would be <tt><yoursite>/joomla/administrator/index.php?option=com_helloworld</tt>. For this example we will navigate to <tt>localhost/joomla/administrator/index.php?option=com_helloworld</tt>.

You can also notice that the ''Hello World!'' component is visible in the administrator site of your Joomla installation under the ''Components'' menu.

==File Details== 
</translate>
{{vanchor|admin/sql/updates/mysql/0.0.1.sql}}
<translate>
is an empty file allowing to initialise schema version of the com_helloworld component.</translate>

<source lang="sql">
</source>

{{vanchor|helloworld.xml}}

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

<name>Hello World!</name>

<creationDate>December 2013</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.1</version>

<description>Description of the Hello World component ...</description>

<update> 
<schemas>
<schemapath type="mysql">sql/updates/mysql</schemapath>
</schemas>
</update>



<files folder="site">
<filename>index.html</filename>
<filename>helloworld.php</filename>
</files>

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

{{vanchor|site/helloworld.php}}

<source lang="php">
Hello World
</source>

{{vanchor|admin/helloworld.php}}

<source lang="php">
Hello World administration
</source>

{{vanchor|index.html}}

<translate>
common to all folders</translate>

<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

==Component Contents==
At this point in the tutorial, your component should contain the following files:
{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 5
| ''[[#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 6
| ''[[#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 8
| ''[[#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

== Contributors ==
* [[User:Ribafs|Ribafs]]
* [[User:Cdemko|Christophe Demko]]
* [[User:Kevinkabatra|Kevin Kabatra]]

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Introduction|Prev: Introduction</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Next: Adding a view to the site part</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:09:10Z

Kevinkabatra: /* Adding a View to Hello World! */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#site/helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|site/helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Packaging the component == </translate>
<translate>
Content of your code directory</translate>
* ''[[#helloworld.xml|helloworld.xml]]''
* ''[[#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[#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]]''
* ''[[#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]]''
* ''[[#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|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>
== Contributors == </translate>
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:08:47Z

Kevinkabatra: /* Adding a View to Hello World! */ Added links to source code, to match how previous tutorial is designed

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create: [[#site/controller.php| controller.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create: [[#site/views/helloworld/view.html.php| view.html.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create: [[#site/views/helloworld/tml/default.php| default.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update: [[#site/helloworld.xml| helloworld.xml]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>.
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|site/helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Packaging the component == </translate>
<translate>
Content of your code directory</translate>
* ''[[#helloworld.xml|helloworld.xml]]''
* ''[[#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[#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]]''
* ''[[#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]]''
* ''[[#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|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>
== Contributors == </translate>
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:06:22Z

Kevinkabatra: /* Adding a View to Hello World! */

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update [[#site/helloworld.php| helloworld.php]]
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>.
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|site/helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Packaging the component == </translate>
<translate>
Content of your code directory</translate>
* ''[[#helloworld.xml|helloworld.xml]]''
* ''[[#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[#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]]''
* ''[[#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]]''
* ''[[#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|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>
== Contributors == </translate>
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T19:03:54Z

Kevinkabatra: Major Revision. Tutorial redesigned to be geared towards beginners.

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

==Note==
* 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.

* You can follow the steps below to add a view to the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive]

==Adding a View to Hello World!==
To add a view we begin by creating a controller, you will need to:
{| border=1
| 1
| Update
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt>
|-
| 2
| Create:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>
|-
| 3
| Create:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt>
|-
| 4
| Create:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt>
|-
| 5
| Update:
| <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt>.
|}

===Update helloworld.php===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.php</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php>
defined('_JEXEC') or die('Restricted access');
</source>

This enables for a secure entry point into the Joomla! platform. [[JEXEC| JEXEC]] contains a detailed explanation.

<source lang="php">
$controller = JControllerLegacy::getInstance('HelloWorld');
</source>

''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]'' is a base class for a Joomla! Controller. In order for our website to use controllers, we must extend this class in our component. The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt>.

<source lang="php">
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
</source>

After the controller is created, we instruct the controller to execute the task, as defined in the URL: <tt><yoursite>/joomla/index.php?option=com_helloworld&task=<task_name></tt>. If no task is set, the default task 'display' will be assumed. When display is used, the 'view' variable will decide what will be displayed. Other common tasks are save, edit, new, etc.

<source lang="php">
$controller->redirect();
</source>

The controller might decide to redirect the page, usually after a task like 'save' has been completed. This last statement takes care of the actual redirection.

The main entry point, helloworld.php, essentially passes control to the controller, which handles performing the task that was specified in the request.

===Create controller.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/controller.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldController extends JControllerLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';

// Display the view
parent::display($tpl);
}
}
</source>
When no task is given in the request variables, the default task will be executed. It's the display task by default. The JControllerLegacy class has such a task. In our example, it will display a view named HelloWorld.

===Create view.html.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/view.html.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
class HelloWorldViewHelloWorld extends JViewLegacy
{
</source>

''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' is a base class for a Joomla! View. In our case, this method will display data using the tmpl/default.php file.

===Create default.php===
Using your preferred file editor, create <tt><path_to_joomla>/htdocs/components/com_helloworld/views/helloworld/tmpl/default.php</tt> and include the source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="php">
<h1><?php echo $this->msg; ?></h1>
</source>

This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.

===Update helloworld.xml===
Using your preferred file editor, open <tt><path_to_joomla>/htdocs/components/com_helloworld/helloworld.xml</tt> and include the revised source code as found ''[[#File Details| File Details]]''.

Code Explanation:
<source lang="xml">
<version>0.0.2</version>
</source>

Updates the version number

<source lang="xml">
<filename>controller.php</filename>
<folder>views</folder>
</source>

Tells installer application to add controller.php and the views/directory

==File Details==
{{vanchor|site/helloworld.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();
</source>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

{{vanchor|site/views/helloworld/view.html.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

{{vanchor|site/views/helloworld/tmpl/default.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>
</source>

{{vanchor|site/helloworld.xml}}
<source lang="xml" highlight="13,30,31">
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.2.0" method="upgrade">

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

== Packaging the component == </translate>
<translate>
Content of your code directory</translate>
* ''[[#helloworld.xml|helloworld.xml]]''
* ''[[#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[#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]]''
* ''[[#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]]''
* ''[[#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|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>
== Contributors == </translate>
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]
*[[User:Kevinkabatra|Kevin Kabatra]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Developing a Basic Component

2015-09-17T17:24:47Z

Kevinkabatra: /* How to add a component to Joomla! */ Adding link to File Details section.

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

<translate>
== Notes ==
* 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.

* If you have used Joomla! before reading this tutorial, you have noticed that extensions are installed using a compressed file containing all the things which are needed for installing and uninstalling them.

* You can follow the steps below to create the Hello World! component, or you can directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-1-basic-component.zip archive]

== How to add a component to Joomla! ==
In this article we will cover how to create and install a basic Joomla! component. For this example we will be working with the Hello World! component.

To begin, you must first use your preferred file manager to create a directory for the Hello World! component. This directory can be anywhere on your file system, as long as it outside of your Joomla! installation directory. For this example we will name the directory <tt>com_helloworld</tt>, but this directory can be named anything.

Next, inside this directory we need to create some files. Using your preferred file manager, create the following files; as you create the files, add the source code for each file which is found in ''[[#File Details| File Details]]''.

{| border=1
| 1
| ''[[#helloworld.xml|helloworld.xml]]''
| this is an XML (manifest) file that tells Joomla! how to install our component.
|-
| 2
| ''[[#site/helloworld.php|site/helloworld.php]]''
| this is the site entry point to the Hello World! component
|-
| 3
| ''[[#index.html|site/index.html]]''
| prevents web server from listing directory content
|-
| 4
| ''[[#index.html|admin/index.html]]''
| prevents web server from listing directory content
|-
| 5
| ''[[#admin/helloworld.php|admin/helloworld.php]]''
| this is the administrator entry point to the Hello World! component
|-
| 6
| ''[[#index.html|admin/sql/index.html]]''
| prevents web server from listing directory content
|-
| 7
| ''[[#index.html|admin/sql/updates/index.html]]''
| prevents web server from listing directory content
|-
| 8
| ''[[#index.html|admin/sql/updates/mysql/index.html]]''
| prevents web server from listing directory content
|-
| 9
| ''[[#admin/sql/updates/mysql/0.0.1.sql|admin/sql/updates/mysql/0.0.1.sql]]''
| file allowing to initialise schema version of the com_helloworld component.
|}

Using your preferred file manager, create a .zip file of this directory. For this example we will name the file <tt>com_helloworld.zip</tt>, again this file could have been named anything.

Now we need to install the Hello World! component. There are two ways to do this, both are covered in [[Installing an extension| Installing an Extension]]. Here we will cover the method using the Extension Manager of Joomla!.

*Using your preferred web browser, navigate to the Administrator panel of your Joomla! site. The address would be <tt><yoursite>/joomla/administrator/index.php</tt>. For this example we will navigate to <tt>localhost/joomla/administrator/index.php</tt>.
*Click Extensions {{rarr}} Manage {{rarr}} Install {{rarr}} Upload Package File {{rarr}} Choose File
*Navigate and Select File
*Click Upload & Install

Note - You should see a message letting you know if the installation succeeded or failed.

You can test this basic function of the component by entering the Hello World! page for the site and administrator portions of your Joomla! website.
* Using your preferred web browser, navigate to the Hello World! component page located on the site portion of your website. The address would be <tt><yoursite>/joomla/index.php?option=com_helloworld</tt>. For this example we will navigate to <tt>localhost/joomla/index.php?option=com_helloworld</tt>.
* Using your preferred web browser, navigate to the Hello World! component page located on the administrator portion of your website. The address would be <tt><yoursite>/joomla/administrator/index.php?option=com_helloworld</tt>. For this example we will navigate to <tt>localhost/joomla/administrator/index.php?option=com_helloworld</tt>.

You can also notice that the ''Hello World!'' component is visible in the administrator site of your Joomla installation under the ''Components'' menu.

==File Details== 
</translate>
{{vanchor|admin/sql/updates/mysql/0.0.1.sql}}
<translate>
is an empty file allowing to initialise schema version of the com_helloworld component.</translate>

<source lang="sql">
</source>

{{vanchor|helloworld.xml}}

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

<name>Hello World!</name>

<creationDate>December 2013</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.1</version>

<description>Description of the Hello World component ...</description>

<update> 
<schemas>
<schemapath type="mysql">sql/updates/mysql</schemapath>
</schemas>
</update>



<files folder="site">
<filename>index.html</filename>
<filename>helloworld.php</filename>
</files>

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

</extension>
</source>

{{vanchor|site/helloworld.php}}

<source lang="php">
Hello World
</source>

{{vanchor|admin/helloworld.php}}

<source lang="php">
Hello World administration
</source>

{{vanchor|index.html}}

<translate>
common to all folders</translate>

<source lang="html4strict">
<html><body bgcolor="#FFFFFF"></body></html>
</source>

=== Contributors ===
* [[User:Ribafs|Ribafs]]
* [[User:Cdemko|Christophe Demko]]
* [[User:Kevinkabatra|Kevin Kabatra]]

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Introduction|Prev: Introduction</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_view_to_the_site_part|Next: Adding a view to the site part</translate>|class=expand}}</div>
</div>
__NOTOC__
<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>

J3.x:Developing an MVC Component/Adding a view to the site part

2015-09-17T16:43:45Z

Kevinkabatra:

<noinclude><languages /></noinclude>
{{review}}
{{:J3.1:Developing an MVC Component/<translate>
en</translate>}}
<translate>
==Note==
* 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 the Joomla!3.x framework, third party component authors divide their code into three main parts:</translate>
<translate>
* ''models'' They manage the data</translate>
<translate>
* ''controllers'' They perform tasks, set and get the states of the models and ask the views to display</translate>
<translate>
* ''views'' They display the content according to the type (''error'', ''feed'', ''html'', ''json'', ''raw'', ''xml'') and the layout chosen by the controllers.</translate>
<translate>
== Setting the controller == </translate>
<translate>
In the core code of Joomla, there is a class able to manage controllers: ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html JControllerLegacy]''. This class has to be extended to be used in our component. In the file <tt>yoursite/components/com_helloworld/helloworld.php</tt> (entry point of our ''Hello World'' component), put these lines:</translate>

{{vanchor|site/helloworld.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

// No direct access to this file
defined('_JEXEC') or die('Restricted access');

// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');

// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));

// Redirect if set by the controller
$controller->redirect();

</source>

<translate>
The ''[https://api.joomla.org/cms-3/classes/JControllerLegacy.html#method_getInstance getInstance]'' static method of the ''JControllerLegacy'' class will create a controller. In the code above, it will instantiate a controller object of a class named ''HelloWorldController''. Joomla will look for the declaration of that class in an aptly named file called <tt>yoursite/components/com_helloworld/controller.php</tt> (it's a default behavior).</translate>

<translate>
Now, <tt>controller.php</tt> needs to be created and ''HelloWorldController'' needs to be declared and defined. So with your favourite file manager and editor, create a <tt>yoursite/components/com_helloworld/controller.php</tt> file containing:</translate>

{{vanchor|site/controller.php}}
<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
</source>

<translate>
When no task is given in the request variables, the default task will be executed. It's the ''display'' task by default. The ''JControllerLegacy'' class has such a task. In our example, it will display a view named ''HelloWorld''.</translate>

<translate>
So with ''task'' simply a public function display() of ''JControllerLegacy'' is refered to.</translate>

{{tip|<translate>
Just a side note for completion, you could call another function aside from ''display()'' by using an URL like this one:</translate>

<pre>http://localhost/index.php?option=com_helloworld&task=insert</pre>

<translate>
This would try to call a function ''insert()'' of our controller (which we would actually have to implement in ''HelloWorldController'' ).</translate>}}

<translate>
== Setting the view == </translate>
<translate>
When JControllerLegacy wants to display a view, it will look for certain files in the <tt>yoursite/components/com_[component_name]/views/[name of view]/</tt> folder.</translate>

<translate>
The name of the folder of the default view is the name of the component itself. In our case the path is <tt>yoursite/components/com_helloworld/views/helloworld/</tt>.</translate>

<translate>
The file that will contain the code of the view is called <tt>view.[view_mode].php</tt>. The default view mode, and probably the only view a component might need is the ''html'' mode. So this give us our file name which is <tt>view.html.php</tt>.</translate>

<translate>
With your favourite file manager and editor, '''create a file <tt>yoursite/components/com_helloworld/views/helloworld/view.html.php</tt>''' able to display the default view and containing:</translate>

<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg = 'Hello World';

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

</source>

<translate>
The ''display'' method of the ''[https://api.joomla.org/cms-3/classes/JViewLegacy.html JViewLegacy]'' class is called with the ''display'' task of the JControllerLegacy class. In our case, this method will display data using the ''tmpl/default.php'' file. With your favourite file manager and editor, create a file '''<tt>yoursite/components/com_helloworld/views/helloworld/tmpl/default.php</tt>''' able to display the default view and containing:</translate>

<source lang="php">
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2015 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->msg; ?></h1>

</source>

<translate>
This template file will be included by the JViewLegacy class. Therefore, here, $this refers to the HelloWorldViewHelloWorld class.</translate>

<translate>
So to give an example, one could call the view inside the ''yoursite/components/com_[component_name]/views/[name of view]/'' folder by calling <code>index.php?option=com_helloworld</code> (this would default to the <tt>yoursite/components/com_helloworld/views/helloworld/</tt> folder) or we could explicitly call the folder by calling:</translate>

<code>index.php?option=com_helloworld&view=helloworld</code>

<translate>
if we change <code>&view=helloworld</code> to something else, e.g. <code>&view=fluffy</code> we would have to create a folder <code>components/com_helloworld/views/fluffy/</code>.</translate>

<translate>
Copy the contents of <code>views/helloworld</code> to <code>views/fluffy</code></translate>

<translate>
The classname of the file <code>view.html.php</code> of the fluffy folder would be ''HelloWorldViewFluffy''. Afterwards you can customize the contents of ''default.php'' of the ''fluffy'' subfolder for custom output and see the output by calling <code>index.php?option=com_helloworld&view=fluffy</code></translate>

<translate>
== Packaging the component == </translate>
<translate>
Content of your code directory</translate>
* ''[[#helloworld.xml|helloworld.xml]]''
* ''[[#site/helloworld.php|site/helloworld.php]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#index.html|site/index.html]]''
* ''[[#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]]''
* ''[[#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]]''
* ''[[#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|admin/index.html]]''
* ''[[S:MyLanguage/J3.2:Developing_an_MVC_Component/Developing_a_Basic_Component#admin/helloworld.php|admin/helloworld.php]]''
* ''[[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/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]]''

<translate>
Create a compressed file of this directory or directly download the [https://github.com/scionescire/Joomla-3.2-Hello-World-Component/archive/step-2-adding-a-site-view.zip archive] and install it using the extension manager of Joomla. You can test this basic component by putting ''index.php?option=com_helloworld'' in your browser address.</translate>

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

<name>Hello World!</name>

<creationDate>December 2013</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.2</version>

<description>Description of the Hello World component ...</description>

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

<administration>

<menu link='index.php?option=com_helloworld'>Hello World!</menu>


<files folder="admin">

<filename>index.html</filename>
<filename>helloworld.php</filename>

<folder>sql</folder>
</files>
</administration>

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

<translate>
'''Result:'''
You will see by default the message contained in the variable ''$this->msg'' in the <tt>view.html.php</tt> file.</translate>

{{notice|<translate>
Please create a pull request or issue at https://github.com/joomla/Joomla-3.2-Hello-World-Component for any code descprepancies or if editing any of the source code on this page.</translate>}}

<translate>
== Contributors == </translate>
*[[User:Gunjanpatel|Gunjan Patel]]
*[[User:cdemko|Christophe Demko]]
*[[User:oaksu|Ozgur Aksu]]
*[[User:Scionescire|Scionescire]]

<div class="row">
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Developing_a_Basic_Component|Prev: Developing a Basic Component</translate>|class=expand success}}</div>
<div class="large-6 columns">{{Basic button|<translate>
S:MyLanguage/J3.x:Developing_an_MVC_Component/Adding_a_menu_type_to_the_site_part|Next: Adding a menu type to the site part</translate>|class=expand}}</div>
</div>

<noinclude>
<translate>

[[Category:Joomla! 3.x]]
[[Category:Joomla! 3.0]]
[[Category:Joomla! 3.1]]
[[Category:Joomla! 3.2]]
[[Category:Joomla! 3.3]]
[[Category:Joomla! 3.4]]
[[Category:Beginner Development]]
[[Category:Component Development]]
[[Category:Tutorials]]
[[Category:Tutorials in a Series]]
</translate>
</noinclude>