World is Welcome To The World of Linux

Journey into the world of linux

Menu
  • About
  • Welcome
Menu

How To Use Ajax Within Joomla! MVC Framework-III

Posted on May 31, 2010 by Ganesh Sharma

If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!

This article is the third in the series of

“Ajax within Joomla! Framework”.

We came to know from the view file that,

the form submits the request and

that request calls the function listCities() from the ajax file.

Here are the contents of my_ajax.js

function showCities()
{
    document.getElementById("city_loading").style.display = "inline";
    var searchForm = document.getElementById('form_ds');
    country_name = escape(searchForm.country.value);
    if (window.XMLHttpRequest)
    {     // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else
    {     // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    //displayLoading(document.getElementById("city_loading"));
    show_progressbar("city_loading");
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 || xmlhttp.readyState=="complete")
        {
            if(xmlhttp.status == 200)
            {
                  document.getElementById("city_loading").style.display = "none";
                  replace_html('city', xmlhttp.responseText);
            }
            else
            {
                  alert("Error reading data");
            }
        }
    }
xmlhttp.open("GET","index2.php?task=listCities&country_name="+country_name, true);
xmlhttp.send();
}

function replace_html(id, content)
{
      document.getElementById(id).innerHTML = content;
}

function show_progressbar(id)
{
      replace_html(id, '<img src="./components/com_mycomponent/js/progress.gif" border="0" alt="Loading..." />');
}

The contents of the file are explained below:

  1. First of all we get the form name by its id, i.e form_ds.
  2. Then we get the value of the country selected. These are the two things we require to query the cities of a particular country.
  3. We make XMLHttpRequest via the ajax code. We use: Get method to pass the values to the controller. This is same way we use to pass variables between files in Joomla! Programming.
  4. We call the method: listCities in the controller. Task means, the function created within controller.php file.
  5. One function we’ve created is: show_progressbar, this is used to show progress wheel while we are waiting for the results.
  6. We use: document.getElementById(“city_loading”).style.display = “none”; This helps to stop progress wheel when results are loaded.

Now, tomorrow I’ll discuss the controller.php file and its role in ajax within Joomla! Framework.

2 thoughts on “How To Use Ajax Within Joomla! MVC Framework-III”

  1. Pingback: Gadget Newz
  2. Geraldo Andrade says:
    November 19, 2010 at 04:03

    Great, very useful!

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Recent Posts

  • Date Command Tutorial(Video)
  • grep Command Tutorial – 1(Video)
  • Introduction To ls Command(Video)
  • Chapter 3
  • Set Position Of Poll Module Into Joomla

Recent Comments

  • Kansas City Trailer Proz on Physical Volume In AIX – A Primer
  • Create volume group in AIX | myunixsheet on How To Create Volume Group
  • Restore of AIX backup on other Unix system - TecHub on What is mksysb And What Are Its Components
  • Firewall Unleashed - InfoSec Institute on Packet Filtering Firewall: An Introduction
  • Manwendra on Proxy Firewall and Gateway Firewall: Introduction

Archives

  • January 2019
  • June 2010
  • May 2010
  • February 2010
  • May 2009
  • April 2009
  • March 2009
  • February 2009
  • January 2009
  • December 2008
  • November 2008

Categories

  • 30 Days To Joomla WebSite Setup
  • A Journey To The World of Linux System Administration
  • Aix
  • Backups
  • Books
  • Firewalls
  • Introduction
  • Joomla
  • Joomla Backup
  • Joomla Web Technology
  • Linux
  • LPAR and Virtualization
  • LVM
  • Pluggable Authentication Modules
  • section navigator pro
  • Security
  • Security Knowledge Base
  • Tips and Tricks
  • Uncategorized
  • World is Welcome Products

Meta

  • Log in
  • Entries RSS
  • Comments RSS
  • WordPress.org
©2023 World is Welcome To The World of Linux | WordPress Theme by SuperbThemes