- Category: Joomla
This is an article to demo the crudest form which uses Joomla's version 2.5 core mootools (uncompressed?). This is intended for absolute novices (like me) who just want to see an example of an AJAX form within Joomla 1.6.x - 2.5.x in it's most basic state. At time of print, I am using this with Joomla 2.5.6.
The examples of the official site (mootools.net) did not work in my Joomla environment nor did most people's examples across the web. All I wanted was a basic example to show me how to send a form asynchronously (ie. running in the background without loading a new page).
This form is more AJ than AJAX as I don't even use an XML file. You'll need to create a receiving file that sends back the data, in my case, I've called it ajax.form.php and the contents of which are:
<?php print "<pre>".print_r($_POST, true)."</pre>"; ?>This just prints back an array of data that was sent to it; obviously you may want to tidy this up but the more basic the receiving data the better. In my example, I'm returning some HTML but for security and stability, you will want this to use an XML file depending on the level of detail you want back.
The following code is basically the least amount of code (or near enough) you will need to get this to work:
Big Note: UPDATE 2012
It is important to refer to the correct mootools scripts in order for this to work. Unfortunately, clients who sign up to template providers who disallow access to their support forums after the subscription period expires are on the rise. I'm going to annoy them all by posting solutions here:
- for Joomla 1.6.x - 2.5.x: Out-of-the-box template:
- for Yootheme: Warp 6: Yootheme template:
You have no idea how long it has taken me to get this code in working order and as easy as it may be to others, this has been quite a challenge. I have tried so many examples, testing different mootools libraries to see why the Joomla ones weren't working. It may not be right, it may not be the best or optimized order but it works for me and that's pretty much all I needed.
- Change www.YourSite.com - Yeah note the URL to the mootools-core-uncompressed.js file, if you have this enabled in Joomla then you already have this and don't need to include it again (just view the source of your webpage that this form will be on).
- Does not use JQuery - Although most of the sites I work for use JQuery as well as MooTools, I needed this for a component that I was building and only wanted to use the files that Joomla versions 1.6 to 2.5 included in their basic install (vanilla/out-of-the-box).
- Will not work with Joomla 1.5 or less - Not 100% sure about this but I tried the example in the Official Joomla Documentation and I couldn't get it to work. They even add a note to say that Joomla 1.6 uses a different version of Mootools and handles forms differently.
Almost forgot this, you can view my example at: http://demo.joellipman.com/scriptdemos/basic_mootools_scripts/basic_joomla_mootools_form/. Note the receiving file is a PHP file and the contents were mentioned previously in this article (-> see ajax.form.php).