How To Use Ajax Within Joomla! MVC Framework-I

Ajax, which stands for Asynchronous JavaScript, is getting popular day by day because of it’s capabilities of displaying data without refreshing the page. The use of ajax is a headache for the absolute beginner, specifically when we want to use it within Joomla! MVC Framework. The article is the first in the series of how to use ajax within Joomla! MVC Framework.

Here is very short introduction to how Ajax Works within Joomla MVC. There are three parts to it:

1. Javascript file which contains Ajax code.
2. Some template file in Joomla! View(V of MVC). e.g default.php, default_search.php etc.
3. Controller where absolute action is taken after calling functions from the model.

Let me go over the process how ajax functions in Joomla! MVC Framework.

1. The view, template file will have a form which will have a submit button and a division for getting data from the ajax response.
2. When we click this button, this will call Ajax code from some file included in the html header.
3. When that ajax code is called, that code in turn calls some task in the default controller controller.php or some custom controller. Which controller, that depends upon the component in question.
4. Then that controller calls some function from the component model as per the requirements.
5. This controller then returns the response to the ajax code.
6. The ajax code returns the data to the pre-defined division of the view template file e.g default.php.

That is the whole working of the ajax for Joomla! MVC Framework. Now whatever we do in Joomla! regarding ajax work is the expansion of this base work.

Tomorrow I’ll start with actual code of files and explain, how each piece of code works.

I hope this will be useful for the Joomla! Ajax adventurists.