This article focusses on the entry page/article for the administrator. Whilst the MVC pattern is the same as for the frontend user, this chapter will rapidly go though all steps and setup the backend counter part in the admin section. This article will only focus on setting up the Basic Framework with a list of all the ''Hellos'' but without user interaction. The actual user interaction is added in the succeeding chapter [[Developing a Model-View-Controller Component - Part 6 - Adding Backend Actions]].

+

This article focuses on the entry page/article for the administrator. Whilst the MVC pattern is the same as for the frontend user, this chapter will rapidly go though all steps and setup the backend counter part in the admin section. This article will only focus on setting up the Basic Framework with a list of all the ''Hellos'' but without user interaction. The actual user interaction is added in the succeeding article [[Developing a Model-View-Controller Component - Part 6 - Adding Backend Actions]].

+

+

== Tutorial specific naming ==

+

Within the next articles the explanation of this administrator section we will keep as close as possible to the component name. For the general overview, lists from the database, we will use ''Hellos'' as identification. The ''Hellos'' naming will be used for viewing and controlling multiple Hellos at once from the database. When selecting a single Hello for Editing or Adding we will use the singular ''Hello'' as naming for the Controller and View. This ''Admin Hello'' has no functional relation with the ''Site Hello'' (the only dependency is the database content, of course).

+

+

Where parts 1,2 and 3 of the MVC explanation were working in the site directory tree of com_hello, part 5 and 6 will focus on the admin directory tree. Part 5 and 6 will not add or change files in the site directory tree. Look at the XML file in the attached example of the full com_hello implementation. The XML configuration file will help you with the exact location of the different files being used in this and the following chapter.

Now that we have a model to retrieve our data, we need to display it. This view will be fairly similar to the view from the site section as well.

Now that we have a model to retrieve our data, we need to display it. This view will be fairly similar to the view from the site section as well.

−

Just as our model was automatically instantiated in the site, so it is in the administrator. Methods that start with get in the model can be accessed using the get() method of the JView class. So our view has three lines: one to retrieve the data from the model, one to push the data into the template, and one to invoke the display method to display the output. Thus we have:

+

Just as our model was automatically instantiated in the frontend, so is it in the administrator section. Methods that start with "get" [e.g. getData()] in the model can be accessed using the get() method of the JView class. So our view has three lines: one to retrieve the data from the model, one to push the data into the template, and one to invoke the display method to display the output. Thus we have:

Look carefully at the almost hidden differences compared to ''site'' example. The data is stored in a variable that is encapsulated within the model. Because the data amount is huge due to using the very handy _getList(), the need for returning a reference in stead of a value is obvious. This is handled in:

+

Look carefully at the almost hidden differences compared to ''site'' example. The data is stored in a variable that is encapsulated within the model. Because the data amount is huge due to using the very handy _getList(), the need for returning a reference instead of a value is obvious. This is handled in:

$items =& $this->get( 'Data');

$items =& $this->get( 'Data');

−

Looking again at this line and you will notice another difference with respect to the ''site'' view.html.php. The calling of the model function is done implicit. The actual model function name is getData(). In the ''site'' example you had to call following two lines:

+

Looking again at this line and you will notice another difference with respect to the ''site'' view.html.php. The calling of the model function is done implicitly. The actual model function name is getData(). In the ''site'' example you had to call following two lines:

$model =& $this->getModel();

$model =& $this->getModel();

$greeting = $model->getData();

$greeting = $model->getData();

−

Both lines are now taken care of by calling: <code>$this->get( 'Data');</code>. Under the surface of this <code>get()</code> the 'Data' is prefixed with 'get' so when using this function make sure the model functions are preceded with 'get'. This function can also be used in the ''site'' section; well to be honest it is good programming to keep the data in the model and address it by reference and this <code>get()</code> method is the preferred way of getting data from the model.

+

Both lines are now taken care of by calling: <code>$this->get( 'Data');</code>. Under the surface of this <code>get()</code> the 'Data' is prefixed with 'get' so when using this function make sure the model functions are preceded with 'get'. This function can also be used in the ''site'' section. Keeping the data in the model and accessing it by reference, via <code>get()</code> methods, is the preferred way of getting data from the model.

==== The Hellos Template ====

==== The Hellos Template ====

Line 234:

Line 240:

<?php

<?php

$k = 0;

$k = 0;

−

for ($i=0, $n=count( $this->items ); $i < $n; $i++)

+

foreach ($this->items as &$row)

{

{

−

$row =& $this->items[$i];

?>

?>

−

<tr class="<?php echo "row$k"; ?>">

+

<tr class="<?php echo "row" . $k; ?>">

<td>

<td>

<?php echo $row->id; ?>

<?php echo $row->id; ?>

Line 276:

Line 281:

== Conclusion ==

== Conclusion ==

−

We have now implemented a basic framework for the backend admin component. The next chapter will extend this framework and add user interaction / database manipulation.

+

We have now implemented a basic framework for the backend admin component. A list where all of the Hellos are displayed. The next chapter will extend this framework and add user interaction / database manipulation.

The full admin component can be downloaded at: [http://joomlacode.org/gf/download/frsrelease/8111/29436/com_hello4_01.zip com_hello4_01].

The full admin component can be downloaded at: [http://joomlacode.org/gf/download/frsrelease/8111/29436/com_hello4_01.zip com_hello4_01].

−

[[Category:Development]]

+

[[Category:Component Development]]

Latest revision as of 08:34, 9 May 2013

This Namespace has been archived - Please Do Not Edit or Create Pages in this namespace. Pages contain information for a Joomla! version which is no longer supported. It exists only as a historical reference, will not be improved and its content may be incomplete.

Contents

Introduction

This article focuses on the entry page/article for the administrator. Whilst the MVC pattern is the same as for the frontend user, this chapter will rapidly go though all steps and setup the backend counter part in the admin section. This article will only focus on setting up the Basic Framework with a list of all the Hellos but without user interaction. The actual user interaction is added in the succeeding article Developing a Model-View-Controller Component - Part 6 - Adding Backend Actions.

Tutorial specific naming

Within the next articles the explanation of this administrator section we will keep as close as possible to the component name. For the general overview, lists from the database, we will use Hellos as identification. The Hellos naming will be used for viewing and controlling multiple Hellos at once from the database. When selecting a single Hello for Editing or Adding we will use the singular Hello as naming for the Controller and View. This Admin Hello has no functional relation with the Site Hello (the only dependency is the database content, of course).

Where parts 1,2 and 3 of the MVC explanation were working in the site directory tree of com_hello, part 5 and 6 will focus on the admin directory tree. Part 5 and 6 will not add or change files in the site directory tree. Look at the XML file in the attached example of the full com_hello implementation. The XML configuration file will help you with the exact location of the different files being used in this and the following chapter.

Creating the Basic Framework

The basic framework of the administrator panel is very similar to the site portion. The main entry point for the administrator section of the component is hello.php. This file is identical to the hello.php file that was used in the site portion except the name of the controller it loads will be changed to HellosController. The default controller is also called controller.php and this file is identical to the default controller in the site portion, with the exception that the controller is named HellosController instead of HelloController. This difference is so that JController will by default load the hellos view, which will display a list of our greetings.

The view and model that we will start with is the hellos view and the hellos model. We will start with the model.

The Hellos Model

The Hellos Model will be very simple. The only operation that we currently need is the ability to retrieve the list of hellos from the database. This operation will be implemented in a method called getData().

The JModel class has a built in protected method called _getList(). This method can be used to simplify the task of retrieving a list of records from the database. We simply need to pass it the query and it will return the list of records.

At a later point in time, we might want to use our query from within another method. Therefore, we will create a private method called _buildQuery() which will return the query that will be passed to _getList(). This makes it easier to change the query as well since it is localized in one place.

Therefore we need two methods in our class: getData() and _buildQuery().

_buildQuery() simply returns the query. It looks like:

/**
* Returns the query
* @return string The query to be used to retrieve the rows from the database
*/function _buildQuery(){$query=' SELECT * '.' FROM #__hello ';return$query;}

getData() will obtain the query and retrieve the records from the database. Now it might happen that we need to retrieve this list of data twice in one page load. It would be a waste to have to query the database twice. Therefore, we will have this method store the data in a protected property so that on subsequent requests it can simply return the data it has already retrieved. This property will be called _data. (<-- Naming convention conflict. Private or Protected data should be preceded with a '_' but as this reference is returned to the view where this data is directly accessed, this data can only be considered as public.)

The Hellos View

Now that we have a model to retrieve our data, we need to display it. This view will be fairly similar to the view from the site section as well.

Just as our model was automatically instantiated in the frontend, so is it in the administrator section. Methods that start with "get" [e.g. getData()] in the model can be accessed using the get() method of the JView class. So our view has three lines: one to retrieve the data from the model, one to push the data into the template, and one to invoke the display method to display the output. Thus we have:

Look carefully at the almost hidden differences compared to site example. The data is stored in a variable that is encapsulated within the model. Because the data amount is huge due to using the very handy _getList(), the need for returning a reference instead of a value is obvious. This is handled in:

$items =& $this->get( 'Data');

Looking again at this line and you will notice another difference with respect to the site view.html.php. The calling of the model function is done implicitly. The actual model function name is getData(). In the site example you had to call following two lines:

$model =& $this->getModel();
$greeting = $model->getData();

Both lines are now taken care of by calling: $this->get( 'Data');. Under the surface of this get() the 'Data' is prefixed with 'get' so when using this function make sure the model functions are preceded with 'get'. This function can also be used in the site section. Keeping the data in the model and accessing it by reference, via get() methods, is the preferred way of getting data from the model.

The Hellos Template

The template will take the data pushed into it from the view and produce the output. We will display our output in a simple table. While the frontend template was very simple, in the administrator we will need a minimal amount of extra logic to handle looping through the data.

You will notice that our output is enclosed in a form. Though this is not necessary now, it will be soon.

We have now completed the basic part of the first view. We have added five files to the admin section of our component:

hello.php

controller.php

models/hellos.php

views/hellos/view.html.php

views/hellos/tmpl/default.php

You can now add these files to the XML install file and give it a try!

Conclusion

We have now implemented a basic framework for the backend admin component. A list where all of the Hellos are displayed. The next chapter will extend this framework and add user interaction / database manipulation.