How To Create Custom Component In Joomla
Developing an MVC Component
This is a multiple-article series of tutorials on how to develop a Model-View-Controller Component for Joomla! Version
.
Begin with the Introduction, and navigate the articles in this series by using the navigation button at the bottom or the box to the right (the Articles in this series).
Introduction
This tutorial is part of the Developing an MVC Component for Joomla! 3.2 tutorial. You are encouraged to read the previous parts of the tutorial before reading this.
There are 2 videos associated with this step in the tutorial, covering MVC Structure and Pagination, and HTML elements and Javascript code.
Basic backend
Designing the backend interface leads us to create at least a Model-View-Controller triptych. We have to modify the administrator entry point of our component, the admin/helloworld.php file.
admin/helloworld.php
<?php /** * @package Joomla.Administrator * @subpackage com_helloworld * * @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt */ // No direct access to this file defined ( '_JEXEC' ) or die ( 'Restricted access' ); // Get an instance of the controller prefixed by HelloWorld $controller = JControllerLegacy :: getInstance ( 'HelloWorld' ); // Perform the Request task $controller -> execute ( JFactory :: getApplication () -> input -> get ( 'task' )); // Redirect if set by the controller $controller -> redirect ();
Create the general controller
The entry point now gets an instance of a HelloWorld prefixed controller. Let's create a basic controller for the administrator part:
admin/controller.php
<?php /** * @package Joomla.Administrator * @subpackage com_helloworld * * @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt */ // No direct access to this file defined ( '_JEXEC' ) or die ( 'Restricted access' ); /** * General Controller of HelloWorld component * * @package Joomla.Administrator * @subpackage com_helloworld * @since 0.0.7 */ class HelloWorldController extends JControllerLegacy { /** * The default view for the display method. * * @var string * @since 12.2 */ protected $default_view = 'helloworlds' ; }
This controller will display the 'HelloWorlds' view by default.
Create the view
With your favourite file manager and editor, create a file admin/views/helloworlds/view.html.php containing:
admin/views/helloworlds/view.html.php
<?php /** * @package Joomla.Administrator * @subpackage com_helloworld * * @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt */ // No direct access to this file defined ( '_JEXEC' ) or die ( 'Restricted access' ); /** * HelloWorlds View * * @since 0.0.1 */ class HelloWorldViewHelloWorlds extends JViewLegacy { /** * Display the Hello World view * * @param string $tpl The name of the template file to parse; automatically searches through the template paths. * * @return void */ function display ( $tpl = null ) { // Get data from the model $this -> items = $this -> get ( 'Items' ); $this -> pagination = $this -> get ( 'Pagination' ); // Check for errors. if ( count ( $errors = $this -> get ( 'Errors' ))) { JError :: raiseError ( 500 , implode ( '<br />' , $errors )); return false ; } // Display the template parent :: display ( $tpl ); } }
In Joomla, views display data using layout. With your favourite file manager and editor, put a file admin/views/helloworlds/tmpl/default.php containing
admin/views/helloworlds/tmpl/default.php
<?php /** * @package Joomla.Administrator * @subpackage com_helloworld * * @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt */ // No direct access to this file defined ( '_JEXEC' ) or die ( 'Restricted Access' ); ?> <form action="index.php?option=com_helloworld&view=helloworlds" method="post" id="adminForm" name="adminForm"> <table class="table table-striped table-hover"> <thead> <tr> <th width="1%"> <?php echo JText :: _ ( 'COM_HELLOWORLD_NUM' ); ?> </th> <th width="2%"> <?php echo JHtml :: _ ( 'grid.checkall' ); ?> </th> <th width="90%"> <?php echo JText :: _ ( 'COM_HELLOWORLD_HELLOWORLDS_NAME' ) ; ?> </th> <th width="5%"> <?php echo JText :: _ ( 'COM_HELLOWORLD_PUBLISHED' ); ?> </th> <th width="2%"> <?php echo JText :: _ ( 'COM_HELLOWORLD_ID' ); ?> </th> </tr> </thead> <tfoot> <tr> <td colspan="5"> <?php echo $this -> pagination -> getListFooter (); ?> </td> </tr> </tfoot> <tbody> <?php if ( ! empty ( $this -> items )) : ?> <?php foreach ( $this -> items as $i => $row ) : ?> <tr> <td> <?php echo $this -> pagination -> getRowOffset ( $i ); ?> </td> <td> <?php echo JHtml :: _ ( 'grid.id' , $i , $row -> id ); ?> </td> <td> <?php echo $row -> greeting ; ?> </td> <td align="center"> <?php echo JHtml :: _ ( 'jgrid.published' , $row -> published , $i , 'helloworlds.' , true , 'cb' ); ?> </td> <td align="center"> <?php echo $row -> id ; ?> </td> </tr> <?php endforeach ; ?> <?php endif ; ?> </tbody> </table> </form>
COM_HELLOWORLD_HELLOWORLDS_NAME, COM_HELLOWORLD_ID and the others are placeholders which will later be replaced with language-specific text. The JText::_ method translates a string into the current language.
checkAll is a javascript function defined in the Joomla core able to check all items.
JHtml::_ is a helper function able to display several HTML output. In this case, it will display a checkbox for the item.
JPagination is a Joomla class able to manage and display pagination object.
Create the model
The HelloWorlds view asks the model for data. In Joomla, there is a class able to manage a list of data: JModelList. Class JModelList and inherited classes need only one method:
- getListQuery which constructs an SQL query
and two states:
- list.start for determining the list offset
- list.limit for determining the list length
The getItems and getPagination methods are defined in JModelList class. They don't need to be defined in the HelloWorldModelHelloWorlds class.
admin/models/helloworlds.php
<?php /** * @package Joomla.Administrator * @subpackage com_helloworld * * @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt */ // No direct access to this file defined ( '_JEXEC' ) or die ( 'Restricted access' ); /** * HelloWorldList Model * * @since 0.0.1 */ class HelloWorldModelHelloWorlds extends JModelList { /** * Method to build an SQL query to load the list data. * * @return string An SQL query */ protected function getListQuery () { // Initialize variables. $db = JFactory :: getDbo (); $query = $db -> getQuery ( true ); // Create the base select statement. $query -> select ( '*' ) -> from ( $db -> quoteName ( '#__helloworld' )); return $query ; } }
The _populateState method is, by default, automatically called when a state is read by the getState method.
Packaging the component
Content of your code directory
- helloworld.xml
- site/helloworld.php
- site/index.html
- site/controller.php
- site/views/index.html
- site/views/helloworld/index.html
- site/views/helloworld/view.html.php
- site/views/helloworld/tmpl/index.html
- site/views/helloworld/tmpl/default.xml
- site/views/helloworld/tmpl/default.php
- site/models/index.html
- site/models/helloworld.php
- admin/index.html
- admin/helloworld.php
- admin/controller.php
- admin/sql/index.html
- admin/sql/install.mysql.utf8.sql
- admin/sql/uninstall.mysql.utf8.sql
- admin/sql/updates/index.html
- admin/sql/updates/mysql/index.html
- admin/sql/updates/mysql/0.0.1.sql
- admin/sql/updates/mysql/0.0.6.sql
- admin/models/index.html
- admin/models/fields/index.html
- admin/models/fields/helloworld.php
- admin/models/helloworlds.php
- admin/views/index.html
- admin/views/helloworlds/index.html
- admin/views/helloworlds/view.html.php
- admin/views/helloworlds/tmpl/index.html
- admin/views/helloworlds/tmpl/default.php
- admin/tables/index.html
- admin/tables/helloworld.php
Create a compressed file of this directory or directly download the 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.
helloworld.xml
<?xml version="1.0" encoding="utf-8"?> <extension type= "component" version= "3.0" method= "upgrade" > <name>Hello World!</name> <!-- The following elements are optional and free of formatting constraints --> <creationDate>January 2018</creationDate> <author>John Doe</author> <authorEmail>john.doe@example.org</authorEmail> <authorUrl>http://www.example.org</authorUrl> <copyright>Copyright Info</copyright> <license>License Info</license> <!-- The version string is recorded in the components table --> <version>0.0.7</version> <!-- The description is optional and defaults to the name --> <description>Description of the Hello World component ...</description> <install> <!-- Runs on install --> <sql> <file driver= "mysql" charset= "utf8" >sql/install.mysql.utf8.sql</file> </sql> </install> <uninstall> <!-- Runs on uninstall --> <sql> <file driver= "mysql" charset= "utf8" >sql/uninstall.mysql.utf8.sql</file> </sql> </uninstall> <update> <!-- Runs on update; New since J2.5 --> <schemas> <schemapath type= "mysql" >sql/updates/mysql</schemapath> </schemas> </update> <!-- Site Main File Copy Section --> <!-- Note the folder attribute: This attribute describes the folder to copy FROM in the package to install therefore files copied in this section are copied from /site/ in the package --> <files folder= "site" > <filename>index.html</filename> <filename>helloworld.php</filename> <filename>controller.php</filename> <folder>views</folder> <folder>models</folder> </files> <administration> <!-- Administration Menu Section --> <menu link= 'index.php?option=com_helloworld' >Hello World!</menu> <!-- Administration Main File Copy Section --> <!-- Note the folder attribute: This attribute describes the folder to copy FROM in the package to install therefore files copied in this section are copied from /admin/ in the package --> <files folder= "admin" > <!-- Admin Main File Copy Section --> <filename>index.html</filename> <filename>helloworld.php</filename> <filename>controller.php</filename> <!-- SQL files section --> <folder>sql</folder> <!-- tables files section --> <folder>tables</folder> <!-- models files section --> <folder>models</folder> <!-- views files section --> <folder>views</folder> </files> </administration> </extension>
Now you can see in your component hello-world an array with two colums, two rows and checkboxes. You can click the checkboxes in order to select the different options you want.
Contributors
- Gunjan Patel
- Christophe Demko
- Ozgur Aksu
- Preston Smith
- Scionescire
How To Create Custom Component In Joomla
Source: https://docs.joomla.org/J3.x:Developing_an_MVC_Component/Basic_backend
Posted by: muellerthateadthe.blogspot.com
0 Response to "How To Create Custom Component In Joomla"
Post a Comment