012. Adding categories

Now you can zip all files and install them via Joomla Extension Manager. After that you can see a link to your component in the left side menu. Clicking on this link will open the basic backend view.

Concluding Remark

Now we have . Up to now we have no . We are going to work on this in the next chapter.

Overview of all files

== Requirements == You need Joomla! 4.x for this tutorial (as of writing currently Joomla! 4.0.0-alpha11-dev)

== File Structure ==

=== Changing administrator/components/com_foos/Model/FoosModel.php ===

The administrator/components/com_foos/Model/FoosModel.php file is ....

==== Completed administrator/components/com_foos/Model/FoosModel.php file ====

The code for the administrator/components/com_foos/Model/FoosModel.php file is as follows:

namespace Joomla\Component\Foos\Administrator\Model;

defined('_JEXEC') or die;

use Joomla\CMS\MVC\Model\ListModel;

/**

Methods supporting a list of foo records.
@since 1.0 / class FoosModel extends ListModel { /*
- Constructor.
- @param array $config An optional associative array of configuration settings.
- @see \JControllerLegacy
- @since 1.0 / public function __construct($config = array()) { parent::__construct($config); } /*
- Build an SQL query to load the list data.
- @return \JDatabaseQuery
- @since 1.0 */ protected function getListQuery() { // Create a new query object. $db = $this->getDbo(); $query = $db->getQuery(true);
  
  // Select the required fields from the table. $query->select( $db->quoteName(array('a.id', 'a.name', 'a.catid', 'a.access')) );
  
  $query->from($db->quoteName('#__foos_details', 'a'));
  
  // Join over the asset groups. $query->select($db->quoteName('ag.title', 'access_level')) ->join( 'LEFT', $db->quoteName('#__viewlevels', 'ag') . ' ON ' . $db->quoteName('ag.id') . ' = ' . $db->quoteName('a.access') );
  
  // Join over the categories. $query->select($db->quoteName('c.title', 'category_title')) ->join( 'LEFT', $db->quoteName('#__categories', 'c') . ' ON ' . $db->quoteName('c.id') . ' = ' . $db->quoteName('a.catid') );
  
  return $query; } }

=== Changing administrator/components/com_foos/access.xml ===

The administrator/components/com_foos/access.xml file is ....

==== Completed administrator/components/com_foos/access.xml file ====

The code for the administrator/components/com_foos/access.xml file is as follows:

=== Changing administrator/components/com_foos/foos.xml ===

The administrator/components/com_foos/foos.xml file is ....

==== Completed administrator/components/com_foos/foos.xml file ====

The code for the administrator/components/com_foos/foos.xml file is as follows:

=== Changing administrator/components/com_foos/forms/foo.xml ===

The administrator/components/com_foos/forms/foo.xml file is ....

==== Completed administrator/components/com_foos/forms/foo.xml file ====

The code for the administrator/components/com_foos/forms/foo.xml file is as follows:

	<field
		name="name"
		type="text"
		validate="Letter"
		class="validate-letter"
		label="COM_FOOS_FIELD_NAME_LABEL"
		size="40"
		required="true"
	 />

	<field
		name="catid"
		type="categoryedit"
		label="JCATEGORY"
		extension="com_foos"
		addfieldprefix="Joomla\Component\Categories\Administrator\Field"
		required="true"
		default=""
	/>

	<field
		name="access"
		type="accesslevel"
		label="JFIELD_ACCESS_LABEL"
		size="1"
	/>
</fieldset>

=== Changing administrator/components/com_foos/sql/update/1.12.0.sql ===

We will implement state later.

The administrator/components/com_foos/sql/update/1.12.0.sql file is ....

==== Completed administrator/components/com_foos/sql/update/1.12.0.sql file ====

The code for the administrator/components/com_foos/sql/update/1.12.0.sql file is as follows:

ALTER TABLE `#__foos_details` ADD COLUMN `catid` int(11) NOT NULL DEFAULT 0 AFTER `alias`;

ALTER TABLE #__foos_details ADD COLUMN state tinyint(3) NOT NULL DEFAULT 0 AFTER alias;

ALTER TABLE #__foos_details ADD KEY idx_catid (catid);

=== Changing administrator/components/com_foos/Extension/FoosComponent.php ===

The administrator/components/com_foos/Extension/FoosComponent.php file is ....

==== Completed administrator/components/com_foos/Extension/FoosComponent.php file ====

The code for the administrator/components/com_foos/Extension/FoosComponent.php file is as follows:

namespace Joomla\Component\Foos\Administrator\Extension;

defined('JPATH_PLATFORM') or die;

use Joomla\CMS\Categories\CategoryServiceInterface; use Joomla\CMS\Categories\CategoryServiceTrait; use Joomla\CMS\Extension\BootableExtensionInterface; use Joomla\CMS\Extension\MVCComponent; use Joomla\CMS\HTML\HTMLRegistryAwareTrait; use Psr\Container\ContainerInterface; use Joomla\Component\Foos\Administrator\Service\HTML\AdministratorService;

/**

Component class for com_foos
@since 1.0.0 */ class FoosComponent extends MVCComponent implements BootableExtensionInterface, CategoryServiceInterface { use CategoryServiceTrait; use HTMLRegistryAwareTrait;

/**
- Booting the extension. This is the function to set up the environment of the extension like
- registering new class loaders, etc.
- If required, some initial set up can be done from services of the container, eg.
- registering HTML services.
- @param ContainerInterface $container The container
- @return void
- @since 1.0.0 */ public function boot(ContainerInterface $container) { $this->getRegistry()->register('foosadministrator', new AdministratorService); }
/**
- Returns the table for the count items functions for the given section.
- @param string $section The section
- @return string|null
- @since 1.0.0 */ protected function getTableNameForSection(string $section = null) { return ($section === 'category' ? 'categories' : 'foos_details');
} }

=== Changing administrator/components/com_foos/tmpl/foo/edit.php ===

The administrator/components/com_foos/tmpl/foo/edit.php file is ....

==== Completed administrator/components/com_foos/tmpl/foo/edit.php file ====

The code for the administrator/components/com_foos/tmpl/foo/edit.php file is as follows:

defined('_JEXEC') or die;

use Joomla\CMS\Factory; use Joomla\CMS\HTML\HTMLHelper; use Joomla\CMS\Router\Route;

HTMLHelper::('behavior.formvalidator'); HTMLHelper::('script', 'com_foos/admin-foos-letter.js', array('version' => 'auto', 'relative' => true));

$app = Factory::getApplication(); $input = $app->input;

// In case of modal $isModal = $input->get('layout') == 'modal' ? true : false; $layout = $isModal ? 'modal' : 'edit'; $tmpl = $isModal || $input->get('tmpl', '', 'cmd') === 'component' ? '&tmpl=component' : ''; ?>

getForm()->renderField('name'); ?> getForm()->renderField('access'); ?> getForm()->renderField('catid'); ?>

=== Changing administrator/components/com_foos/tmpl/foos/default.php ===

The administrator/components/com_foos/tmpl/foos/default.php file is ....

==== Completed administrator/components/com_foos/tmpl/foos/default.php file ====

The code for the administrator/components/com_foos/tmpl/foos/default.php file is as follows:

defined('_JEXEC') or die;

use Joomla\CMS\HTML\HTMLHelper; use Joomla\CMS\Language\Text; use Joomla\CMS\Router\Route; ?>

items)) : ?>

items); foreach ($this->items as $i => $item) : ?>

escape($item->name); ?>

'; ?> escape($item->name); ?>

escape($item->category_title); ?>

							</td>
							<td class="small d-none d-md-table-cell">
								<?php echo $item->access_level; ?>
							</td>
							<td class="d-none d-md-table-cell">
								<?php echo $item->id; ?>
							</td>
						</tr>
						<?php endforeach; ?>
					</tbody>
				</table>

			<?php endif; ?>
			<input type="hidden" name="task" value="">
			<input type="hidden" name="boxchecked" value="0">
			<?php echo HTMLHelper::_('form.token'); ?>
		</div>
	</div>
</div>

== Test your component ==

Now you can zip all files and install them via Joomla Extension Manager.

You have to run a new installation or fix the database due to the changes in the database.

After that you can

It would be good, to set a default categorie while installing your component. You can do this in the file script.php

== Example in Joomla! ==

In the sidebar you now see another menu item. With this menu item you can create categories for your extension.

File:as_j4_t_12b_1.png

You can select this category when editing an item.

File:as_j4_t_12b_2.png

If a category is assigned, it will be displayed in the overview.

File:as_j4_t_12b_3.png

== Component Contents ==

At this point in the tutorial, your component should contain the following files: {| border=1 | 1 | administrator/components/com_foos/Controller/DisplayController.php | this is the administrator entry point to the Foo component

unchanged
7
administrator/components/com_foos/Controller/FooController.php
this is the entry point to the Foo component
unchanged
-
1
administrator/components/com_foos/Extension/FoosComponent.php
the interface BootableExtensionInterface where a component class can load its internal class loader or register HTML services see https://github.com/joomla/joomla-cms/pull/20217
changed
-
7
administrator/components/com_foos/Field/FooField.php
the interface BootableExtensionInterface where a component class can load its internal class loader or register HTML services see https://github.com/joomla/joomla-cms/pull/20217
unchanged
-
7
administrator/components/com_foos/Model/FooModel.php
this is the model of the Foo component item
unchanged
-
6
administrator/components/com_foos/Model/FoosModel.php
this is the model of the Foo component
unchanged
-
1
administrator/components/com_foos/Service/HTML/AdministratorService.php
the html service see https://github.com/joomla/joomla-cms/pull/20217
unchanged
-
7
administrator/components/com_foos/Table/FooTable.php
the database table
unchanged
-
1
administrator/components/com_foos/View/Foos/HtmlView.php
file representing the view in the back end
unchanged
-
1
administrator/components/com_foos/services/provider.php
the service provider interface see https://github.com/joomla/joomla-cms/pull/20217
unchanged
-
6
administrator/components/com_foos/sql/install.mysql.utf8.sql
During the install/uninstall/update phase of a component, you can execute SQL queries through the use of this SQL text file
unchanged
-
6
administrator/components/com_foos/sql/uninstall.mysql.utf8.sql
During the install/uninstall/update phase of a component, you can execute SQL queries through the use of this SQL text file
unchanged
-
7
administrator/components/com_foos/forms/foo.xml
the default form in the back end
unchanged
-
7
administrator/components/com_foos/tmpl/foo/edit.php
the default view in the back end
unchanged
-
7
administrator/components/com_foos/tmpl/foo/modal.php
the default view in the back end
unchanged
-
1
administrator/components/com_foos/tmpl/foos/default.php
the default view in the back end
unchanged
-
7
administrator/components/com_foos/tmpl/foos/modal.php
the default view in the back end
unchanged
-
1
administrator/components/com_foos/foos.xml
this is an XML (manifest) file that tells Joomla! how to install our component.
unchanged
-
1
administrator/components/com_foos/script.php
the installer script
unchanged
-
8
administrator/components/com_foos/language/en-GB/en-GB.com_foos.ini
the language file
unchanged
-
8
administrator/components/com_foos/language/en-GB/en-GB.com_foos.sys.ini
the language file
unchanged
-
9
administrator/components/com_foos/config.php
the configuration
unchanged
-
10
administrator/components/com_foos/access.xml
the ACL file for permissen handling
unchanged
-
11a
administrator/components/com_foos/Rule/LetterRule.php
the server side validation rule
unchanged
-
2
components/com_foos/Controller/DisplayController.php
this is the frond end entry point to the Foo component
unchanged
-
4
components/com_foos/Model/FooModel.php
this is the frond end model for the Foo component
unchanged
-
2
components/com_foos/View/Foo/HtmlView.php
file representing the view in the frond end
unchanged
-
7
components/com_foos/View/Foos/HtmlView.php
file representing the view in the frond end
unchanged
-
2
components/com_foos/tmpl/foo/default.php
the default view in the frond end
unchanged
-
3
components/com_foos/tmpl/foo/default.xml
the xml for the menu item
unchanged
-
8
components/com_foos/language/en-GB/en-GB.com_foos.ini
the language file
unchanged
-
8
components/com_foos/language/en-GB/en-GB.com_foos.sys.ini
the language file
unchanged
-
7
media/com_foos/js/admin-foos-modal.js
the javascript file
unchanged
-
11b
media/com_foos/js/admin-foos-letter.js
the client side validation rule
unchanged
-
}

== Conclusion ==

You can now classify the items into categories. Next, we'll look at how to change the state of an item. Next

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

012. Adding categories

Adding categories

In this chapter we will ...

Newly created or Modified files

All changes at a glance

More detailed explanations

File Structure

Example in Joomla 4

Side Note

Test your component

Concluding Remark

Overview of all files

Clone this wiki locally