How To Add Backend Toolbars in Joomla

Every backend view in Joomla has control over the toolbar area appearing just above the main output. This toolbar is controlled through some helper functions that make it impossible to mess up.

So let's login to the backend and add some toolbars to our Places view now. Let's go to Components>Noida City>Places.

No Toolbar added in backend

Here we have the list view that we have already built in our previous tutorial and we are just going to add a toolbar up here at the top, so that we have some buttons that we can use on these records.

Editing view html file

So go to administrator>components>com_noidacity>views and replace the code of view.html.php file with the following lines of code.

  1. <?php
  2. defined( '_JEXEC' ) or die;
  3.  
  4. jimport('joomla.application.component.view');
  5.  
  6. class NoidaCityViewPlaces extends JView
  7. {
  8. protected $items;
  9.  
  10. public function display($tpl = null)
  11. {
  12. $this->items = $this->get('Items');
  13.  
  14. $this->addToolbar();
  15.  
  16. parent::display($tpl);
  17. }
  18.  
  19. public function addToolbar()
  20. {
  21. JToolBarHelper::title(JText::_('COM_NOIDACITY_PLACES_TITLE'));
  22.  
  23. JToolBarHelper::addNew('place.add');
  24. JToolBarHelper::editList('place.edit');
  25.  
  26. JToolBarHelper::divider();
  27.  
  28. JToolBarHelper::publishList('places.publish');
  29. JToolBarHelper::unpublishList('places.unpublish');
  30.  
  31. JToolBarHelper::divider();
  32.  
  33. JToolBarHelper::archiveList('places.archive');
  34.  
  35. JToolBarHelper::trash('places.trash');
  36.  
  37. }
  38. }

Toolbar added in the backend joomla

So after you replace and save view.html.php file go back to the backend and hit Refresh and magically you see a title for the screen and you see all of these different toolbar buttons. So let's see what actually happened.

  1. JToolBarHelper::title(JText::_('COM_NOIDACITY_PLACES_TITLE'));

First, we have the title function of JtoolBarHelper. This JtoolBarHelper::title function is receiving one argument and that is the title that we want to display. So we are using JText to translate the language string COM_NOIDACITY_PLACES_TITLE and its returning Noida City Places that's being displayed here on the left.

  1. JToolBarHelper::addNew('place.add');
  2. JToolBarHelper::editList('place.edit');
  3.  
  4. JToolBarHelper::divider();
  5.  
  6. JToolBarHelper::publishList('places.publish');
  7. JToolBarHelper::unpublishList('places.unpublish');
  8.  
  9. JToolBarHelper::divider();
  10.  
  11. JToolBarHelper::archiveList('places.archive');
  12.  
  13. JToolBarHelper::trash('places.trash');

And then next we have addNew edit list, a divider, publishList, unpublishList, a divider then archiveList and trash, it displays all these different toolbar buttons along with divider so we can visually separate different tasks. So for instance, we have a New task and an Edit task here and we want to visually separate that from the publishing and the unpublishing and we definitely want to separate that from trash. All we had to do was add these functions and Joomla takes care of displaying the buttons.

  1. JToolBarHelper::editList('place.edit');

The arguments that we are passing into these functions are the task names that we want to assign to these buttons. So what will happen is whatever we click on say editList button that is going to tell Joomla to fire off the Place Edit task.

Adding toolbars to your Joomla component is simplified through the use of standard functions. You don't have to worry about getting the markup right or lining things up, the class handles this automatically. When you create toolbar buttons, they're loaded with tasks and when clicked, those buttons submit the task along with the form.