JoomlaEquipment Becomes Free of Charge!

Now as soon the components not commercial anymore we will give guarantee support only for paid users in priority. Please if you are paid user send support request from the Ask Help form, other emails we will not check for support, just for information. Also note you will need include your order number in request.
JDefender — Ultimate Joomla Protection
News Joomla Components arrow Tutorials arrow Development tips and tricks arrow Joomla hello world MVC component Tutorial
Joomla hello world MVC component Tutorial
Friday, 16 March 2007

What Is MVC

Revised for Joomla 1.5 beta 2

Model-view-controller (MVC) is an architectural pattern used in software engineering. In complex computer applications that present lots of data to the user, one often wishes to separate data (model) and user interface (view) concerns, so that changes to the user interface do not impact the data handling, and that the data can be reorganized without changing the user interface. The model-view-controller solves this problem by decoupling data access and business logic from data presentation and user interaction, by introducing an intermediate component: the controller. It is common to split an application into separate layers: presentation (UI), domain, and data access. In MVC the presentation layer is further separated into view and controller. MVC encompasses more of the architecture of an application than is typical for a design pattern.

Model The domain-specific representation of the information on which the application operates. In Joomla it is MySQL database tables. Joomla model classes basically contains table schemes. Formerly known as mosTable.

View Renders the model into a form suitable for interaction, typically a user interface element. In Joomla it is set of View class and 1 or more templates.

Controller Processes and responds to events, typically user actions, and may invoke changes on the model. In Joomla process tasks. to trigger tasks, Every thing you need is to create methods in controller class with the same name as a task.

Joomla MVC Works as follows

  1. User access Component (without any task or controller variables)
  2. Default Controller Class constructed. Then controller call default view and displayed. Of course this controller render default view.
  3. User click on any control. The control should have task and controller variables in URL, or only task. (E.g. index.php?option=com_mvc&controller=books&task=view)
  4. If controller passed Joomla looks for new controller file and construct it. Then Render according the task.

Where is the Model? Model is used inside controllers' task functions. If it is for example Publish task, function publish will launch appropriate model to change published field.

File structure explanation

  • Component
    • Controllers
      • Controller1.php
      • Controller2.php
    • Views
      • View1
        • Tmpl
          • View1.php
          • View2.php
        • View.html.php
      • View2
        • Tmpl
          • View1.php
          • View2.php
        • View.html.php
    • Models
      • Model1.php
      • Model2.php
    • Admin.component.php
    • Controller.php

Controller folder contains controller classes. Foe example for Book Library, Book Category controller, Book controller, Book Publisher controller and so on.

Models contain Model classes. One Model class is equal to one DB table.

View folder contains view classes and templates. Every view class may have few templates that are stored in tmpl folder. Every view class has the same name view.html.php. And tmpl folder contains html template files. Admin.component.php is a component launch file and controller.php is default controller. Let's create most simple MVC Component.

We will create component called mvc.

The component we will create can be downloaded here.
  1. Create folder administrator/components/com_mvc.
  2. Create file administrator/components/com_mvc/admin.mvc.php. This is standard Joomla file that will be launched on access to the component.

    File listing: admin.mvc.php
    1. <?php 
    2. defined( '_JEXEC' ) or die( 'Restricted access' );
    3.  
    4. require_once (JPATH_COMPONENT.DS.'controller.php');
    5.  
    6. if($controller = JRequest::getVar('controller')) {
    7.   require_once (JPATH_COMPONENT.DS.'controllers'.
    8.     DS.$controller.'.php');
    9. }
    10.  
    11. $classname   = 'MvcController'.ucfirst($controller);
    12. $controller   = new $classname( );
    13.  
    14. $controller->execute( JRequest::getVar('task'));
    15. $controller->redirect();
    16. ?> 
      

    Line 2 is to protect document from direct access. line 4 to require default controller. This controller will render pages if controller GET/POST variable is not set. 6-8 to include other controller class if controller GET/POST variable was set. 10-11 create new controller class. 13-14 execute controller or render page according task

    This file is quite simple. First it includes controller, then create class, then execute.

  3. Create administrator/components/com_mvc/controller.php. This is controller we includes in line 4 of admin.mvc.php. This controller will be launched if there was not any GET/POST controller variable found.

    File listing: controller.php
    1. <?php
    2. jimport('joomla.application.component.controller');
    3.  
    4. class MvcController extends JController
    5. {
    6.     function display() {
    7.         parent::display();
    8.     }
    9. }
    10. ?>
    11.  
      

    2d line to include Joomla API controller class for extending new one created in line 4. Function display render default view. More about that later.

    Basically that is all we need. If instead parent::display(); we put echo "test this"; we will see this on the main page of the component. But let's create fully structured MVC component. For that we need to create View for this controller.

    Default view should have the same name as the component.

  4. Create folder administrator/components/com_mvc/views.
  5. Create folder administrator/components/com_mvc/views/mvc. To create default view we need to name this folder as we named component.

  6. Create file administrator/components/com_mvc/view/mvc/view.html.php. This file will have view class. We do not use "mvc" word in the name of this file. Every view class has different folder but the same file name. it is view.html.php

    File listing: views/mvc/view.html.php
    1. <?php
    2. jimport( 'joomla.application.component.view');
    3. class MvcViewMvc extends JView
    4. {
    5.     function display($tpl = null)
    6.     {
    7.         JToolBarHelper::title(JText::_( 'MVC Main' ), 'generic.png');
    8.         parent::display($tpl);
    9.     }
    10. }
    11. ?> 
      

    Line 2 we include Joomla API View class to extend new one we create in line 3. 5-10 create function display(). This function is called by default, by MvcController class if not task called.

    I used JToolBarHelper::title() to display tile. Here you can also use other JToolBarHelper methods. Also here you can make DB queries and prepare HTML elements to render such as Published Yes/No radio button set, Public/Registered/Special access select list, pageNav class to create navigation and other. Please, note the difference. In this view class we use Models(tables) and SQL queries to get information to create HTML elements to render. But in controller we make SQL queries and use models to control and operate records. Something like delete, publish, save, ...

    Function display() will be called by default if there is no GET/POST task variable set. parent::display($tpl); will call default template if POST/GET layout variable is not set. So let's create default template.

  7. Create file administrator/components/com_mvc/view/mvc/tmpl/default.php. 
    File listing: views/mvc/tmpl/default.php
    1. <h1>MVC Main</h1>
    2. <a href="index.php?option=com_mvc&controller=list">List something</a> 
      

    This is HTML document. This template will display H1 header and link to other controller. This is complete MVC minimum component. We only lack Models.

    Please, save all files and try to call your new component. Login to Joomla admin and put to address line /index.php?option=com_mvc. Before you continue please, be sure all code works fine till this point.

    Everything you will read below just to explain some more things. How to control different tasks and different Views within one Controller. For that, let's create another section that will be controlled by Controller list. First link to controller is without task so we will call default View again and create some more links with tasks to call other Views.

  8. Lets imagine we clicked on index.php?option=com_mvc&controller=list link. That means we enable following lines in admin.mvc.php. 
    1. if($controller = JRequest::getVar('controller')) {
    2.   require_once (JPATH_COMPONENT.DS.'controllers'.
    3.     DS.$controller.'.php');
    4. } 
      

    That means we need to create file administrator/components/com_mvc/controllers/list.php.

  9. Create it.

    File listing: controllers/list.php
    1. <?php
    2. jimport('joomla.application.component.controller');
    3.  
    4. class MvcControllerList extends JController
    5. {
    6.   function __construct()
    7.    {
    8.       parent::__construct();
    9.    }
    10.   function display() {
    11.       JRequest::setVar('view', 'list');
    12.     parent::display();
    13.    }
    14. }
    15. ?> 
      

    JRequest::setVar('view', 'list'); tells this controller to look for View in views/list folder. If we skip or delete this line, this controller class will look for View in views/mvc default folder. So if we told controller to look for View in list folder, let's create it.

  10. Create folder administrator/components/com_mvc/view/list
  11. Create folder administrator/components/com_mvc/view/list/tmpl
  12. Create file administrator/components/com_mvc/view/list/view.html.php 
    File listing: views/list/view.html.php
    1. <?php
    2. jimport( 'joomla.application.component.view');
    3. class MvcViewList extends JView
    4. {
    5.    function display($tpl = null)
    6.   {
    7.      JToolBarHelper::title(JText::_( 'List' ), 'generic.png' );
    8.      parent::display($tpl);
    9.   }
    10. }
    11. ?> 
      

    I won't explain this file. It is the same as views/mvc/view.html.php, only name of the class is different.

  13. Create file administrator/components/com_mvc/view/list/tmpl/default.php 
    File listing: views/list/tmpl/default.php
    1. <h1>This is Default.php</h1>
    2. <P>This file launch automatically is nothing 
    3. passed to JRequest::setVar('layout', 'something');</P>
    4. <a href="index.php?option=com_mvc&controller=list&task=test">
    5.     test</a><BR>
    6. <a href="index.php?option=com_mvc&controller=list&task=new_task">
    7.     new_task</a><BR> 
      

  14. That is it. It should work ok now. I mean you can easily navigate from MVC component homepage to list controller homepage.

    But this file will display few links that have different tasks within same Controller. Here is how you can handle them. Start with task=new_task.

  15. Create function new_task in File controllers/list.php.

    File listing after adding function: controllers/list.php
    1. <?php
    2. jimport('joomla.application.component.controller');
    3. class MvcControllerList extends JController
    4. {
    5.   function __construct()
    6.   {
    7.     parent::__construct();
    8.   }
    9.   function display() {
    10.     JRequest::setVar('view', 'list');
    11.     parent::display();
    12.   }
    13.   function new_task()
    14.   {
    15.     JRequest::setVar('view',  'list');
    16.     JRequest::setVar('layout','newtask');
    17.     parent::display();
    18.   }
    19. }
    20. ?> 
      

    We created function new_task() in line 13-18, that will be called if GET/POST task variable equal to new_task. JRequest::setVar('view', 'list'); tells controller to look for View in views/list/ folder. JRequest::setVar('layout','newtask'); tells controller that View should display newtask template or really newtask.php. Let's create it.

  16. Create file administrator/components/com_mvc/view/list/tmpl/newtask.php 
    File listing: views/list/tmpl/newtask.php
    1. <h1>This is new task</h1>
    2. <P>This task1, task2, new_task triger the same function </P>
    3. <a href="index.php?option=com_mvc&controller=list">Go back</a> 
      

    This file displays some text and link back to list controller homepage. Save all files and try it. Try to navigate to list controller homepage and click on new_task link. If you see text of above listing you are done. Congratulation. You have just created new task.

  17. One more thins to know. It is possible to call same method with different tasks. For that add $this->registerTask( 'test' , 'new_task' ); to construct method of controllers/list.php.

    Final listing: controllers/list.php
    1. <?php
    2. jimport('joomla.application.component.controller');
    3.  
    4. class MvcControllerList extends JController
    5. {
    6.   function __construct()
    7.   {
    8.     parent::__construct();
    9.     
    10.     $this->registerTask( 'test'  , 'new_task' );
    11.   }
    12.   function display() {
    13.     JRequest::setVar('view', 'list');
    14.     parent::display();
    15.   }
    16.   function new_task()
    17.   {
    18.     JRequest::setVar('view',  'list');
    19.     JRequest::setVar('layout','newtask');
    20.     parent::display();
    21.   }
    22. }
    23. ?> 
      
    Save all files and now try click test link on list controller homepage.
  18. Later I'll write a lesson on how to use Models and we will create simple guestbook component.
Comments (42)Add Comment
test comments
written by Sergey, June 17, 2007
Comments did not work for long time and I thought that no one is interested in it that is way I did not write tutorial on how to create models and so on.
Keep the tutorials coming
written by Tom Fuller, June 29, 2007
Sergey:

we who are new to programming for Joomla 1.5 need great tutorials like yours. I am trying to create a Message Management System for my church.

I have Hagen Graf's book Joomla 1.5 Beta - and ran into a fatal error using a call to JcommonHTML. I noticed a thread in a discussion of your mvc component about it, but can't find out if something has changed.

I already changed JMenuBar to JToolBarHelper in the code of mvc that made it work.

Was there a change to the way the JCommonHTML worked or a change to the name that you know of?

Thanks!

tom
Great Help!
written by Duke, July 06, 2007
Hi!
I just want to thank you for this nice tutorial! It helped me alot understanding the joomla-api and how to get started! Keep on writing more tutorials like this!

Greetings,
Duke
Keep getting logged out
written by Charlotte, July 10, 2007
I tried to go through this guide, but after step 7 when I try to call my component I keep getting logged out. I haven't changed anything in the code and the folder structure is the same as the example. smilies/cry.gif
Thank you!
written by sashakk, July 24, 2007
Thx so much for your tutorial. Im waiting for your new ones.
Thank you for evaluation
written by Sergey Romanov2, August 31, 2007
Very appreciate that.
Great Tutorial
written by Jean Rumeau, October 29, 2007
I've been using joomla for a long time but I'm new to the components development so im trying this tutorial, everything's going well, but now i want to know is where are the JToolbarHelper methods because i cant find them in the API documentation.

Greetings
Vacation seeker.
written by nick88, November 30, 2007
I'm looking for an erotic adult vacation in the Caribbean island of Dominican Republic, some place where the beach villas are nice and the girls are nicer.
your dailymessage component of joomla 1.5 is not work in proper way
written by krishna kumar, December 03, 2007
respected sir/madam, your i have to installed dailymessage component of joomla 1.5 ,bit there are problem , when we add a main menu as daily message and we want to display in front end ,and click on (main menu)dailymessage then there display a error message.
error as

Warning: Missing argument 1 for JMenu::getInstance(), called in D:phpxampphtdocsjoomla_newcomponentscom_dailymessagedai lymessage.php on line 23 and defined in D:phpxampphtdocsjoomla_newlibrariesjoomlaapplicationmen u.php on line 84

Fatal error: Call to undefined method JException::getActive() in D:phpxampphtdocsjoomla_newcomponentscom_dailymessagedai lymessage.php on line 30
Many thanks
written by ze0, December 04, 2007
The bet tutorial i??ve ever found. I??ll bookmark this place! Thx again! smilies/smiley.gif
Well done
written by Nikolai, December 17, 2007
Thanks for your afford, very well done.
tanks
written by hamidreza, February 18, 2008
Tanks for you . smilies/smiley.gif
jhjkhjhjkhj
written by ghfghf, February 25, 2008
smilies/kiss.gifhjhj smilies/cheesy.gif smilies/grin.gif smilies/angry.gif
Multiple table models
written by irfan ahmed, March 18, 2008
Your tutorial is bull's eye, and clear. if examples of models involving more than 1 with joins and views . how to manage update delete for master table and foreign keys, will be a welcome one.

thanks for an excellent tutorial on MVC in joomla.
has anyone got a way to do a module in MVC ?
written by clive, April 03, 2008
has anyone got a way to do a module in MVC ?
IF any one found some tuts on this site or else where , do give me a shout
This e-mail address is being protected from spam bots, you need JavaScript enabled to view it
Thanks
written by moynul, April 11, 2008
Oh, You really help me for understanding smilies/smiley.gif
Thanx you for this Tutorial
written by DonPedro, April 23, 2008
You tutorial helps us to develop some simple extentions for our cliens.
Joomla is mus more different compare to Typo3
Per
another one
written by Johny2, April 30, 2008
Hi all, I found a very nice tutorials here: http://www.vojtechovsky.net/joomla/

Regards
Johny
Thanx for this tutorial
written by amit kamble, May 09, 2008
Thank you very much for such a great tutorial
I agree
written by Little Joe, June 21, 2008
This is a good entry tutorial for creating own components. I also would greatly welcome the Model tutorial as well as the guestbook component tutorial that demonstrate the MVC pattern under real circumstances. All the tutorials on the web are more or less crap, because they show you how to have a "hello world" output, but they do not show how to properly work with different controllers and models, how to insert/update/delete database records and so on. Also lacking on the web is a competent description on how to code adminsitrative backend stuff and the "secrets" of the different XML files to add parameters and stuff to your component.

Seriously Sergey, your tutorial is a BIG HELP for anybody who start component development and it would be a pity if you do not continue your tutorial series.

Keep up your good work!
Nice Tutorial
written by Mithun, July 22, 2008
This is very nice tutorial.
It helped me a lot.
I want to display a form when new button is clicked.
current file -- com_name/admin/views/rating/tmpl/default.php

com_name/admin/views/rating/tmpl/form.php


np
written by HT, July 24, 2008
thanks for great tutorial
woa
written by H, July 24, 2008
that's great tutorial, http://gaxgame.com
Thankx for your greate guide!!can you help me
written by wdanaw, August 16, 2008
Thanx a lot!

can you tell me if I have a default controller and 2 views the first one is to render the form and the second view its for render the congratulation page, how i can to tell to controller to look for the second view after the submit?!!please help me!!I must to do a component for 1 september
http://www.powerleveling-wowgold.com
written by wow gold, September 04, 2008
can you tell me if I have a default controller and 2 views the first one is to render the form and the second view its for render the congratulation page, how i can to tell to controller to look for the second view after the submit?!!please help me!!I must to do a component for 1 september
I don't understnd this way
written by TungTranManh, September 08, 2008
to the best of my knowledge, there ought to defer to MVC model and fashioned file there is install
Comments 10 1525
written by Ashley 152513, September 10, 2008
nice1ee http://16.catty.az.pl/86.html | delta hawaii flights
- watches mens omega
- cheap charter flights to the caribbeanfrom toronto
- non stop flights southwest airlines
- cheap flights to south africa cape town from chicago
- california bankruptcy credit cards
- work at home online free
- army swiss watches
- white gold pink topaz ring jewelry watches
-
Thanks for your tutorial!
written by Tuan ANh, September 24, 2008
This tutorial help me understand more about joomla

Thank a lot!!1
wow gold
written by wow gold, October 11, 2008
This tutorial help me understand more about joomla wow gold
http://www.wow-powerleveling-wow.com/
written by wow gold, October 11, 2008
This tutorial help me understand more about joomla
good job
written by Dariusz, October 13, 2008
Nice tutorial. Well prepared.
One suggestion is that you could prepare the screens with the code so that it would be possible to copy/paste the code without the line numbers inside.
I had to remove them manually. Maybe I am to detailed but just to suggest some improvements with could save some time in longer tutorials.
smilies/cheesy.gif
But anyway grat job!!!!
...
written by Tiffany Jewellery, October 15, 2008
Thanx a lot!

can you tell me if I have a default controller and 2 views the first one is to render the form and the second view its for render the congratulation page, how i can to tell to controller to look for the second view after the submit?!!please help me!!I must to do a component for 1 september
...
written by Tiffany Jewellery, October 15, 2008
Tiffany Jewellery: tiffany necklaces, tiffany rings, tiffany pendants, tiffany bracelets, tiffany earrings, tiffany accessories and tiffany sets
...
written by Tiffany Jewellery, October 15, 2008
http://tiffanymall.co.uk
Great Tutorial
written by Hakan Atil, October 24, 2008
Thank you for this nice tutorial. It helped me a lot
...
written by sda, October 31, 2008
http://www.wow-powerleveling-wow.com/
demo
written by demo, November 28, 2008
smilies/wink.gif smilies/cheesy.gif smilies/grin.gif smilies/grin.gif smilies/cool.gif smilies/tongue.gif :- smilies/kiss.gif smilies/cry.gif smilies/cry.gif smilies/kiss.gif smilies/tongue.gif :- smilies/shocked.gif smilies/smiley.gif smilies/wink.gif smilies/cool.gif smilies/cool.gif smilies/cool.gif smilies/cool.gif smilies/shocked.gif smilies/shocked.gif smilies/shocked.gif
...
written by Donny, December 09, 2008
[http://www.charmingirl-china.com lingerie wholesale]
Great Tutorials
written by vikas garg, December 19, 2008
Hey, Thanks for your great tutorials
cheap wow gold
written by wow gold, December 27, 2008
thank you for the information
...
written by wow gold, December 27, 2008
buy wow goldcheap wow goldwow goldcheapest wow goldwarhammer goldwarhammer powerlevelingwar goldwar powerlevelingwar power levelingwarhammer powerlevel
Message driven system
written by Mizhad, January 25, 2009
Indeed great. The most clear explanation I read about Joomla MVC. I had difficult to understand that the controller is a message dispatcher, this works exactly as any message driven framework or OS. Thank you very much for both you rime and effort.

Write comment
quote
bold
italicize
underline
strike
url
image
quote
quote
Smiley
Smiley
Smiley
Smiley
Smiley
Smiley
Smiley
Smiley
Smiley
Smiley
Smiley
Smiley

busy
Last Updated ( Wednesday, 18 July 2007 )
 
Delicious
Furl it!
Spurl
digg
Reddit
YahooMyWeb
!
Next >
Address: Joomla Equipment, Box 1951, Bishkek, 720000, Kyrgyzstan
Telephones: Office: +996 312 68-91-34, Mobile: +996 543 91-81-42
More contacts...