How to make jQuery Ajax call in Joomla

If your are a Joomla developer sometimes you encounter a task which needs to produce jQuery Ajax call in order to add some additional content to a Joomla article page or just to make some operation in a background. In this case this article will help you to implement this feature on a page.
So first create an empty file called: view.ajax.php and upload it to YOUR_SITE_HOME/components/com_content/views/article folder Add the php code below into this file:
<?php /** * @copyright Copyright (C) 2005 - 2014 Open Source Matters, Inc. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt */ defined('_JEXEC') or die; /** * HTML Article View class for the Content component * * @package Joomla.Site * @subpackage com_content * @since 1.5 */ class ContentViewArticle extends JViewLegacy { function display($tpl = null) { $app = JFactory::getApplication(); $user = JFactory::getUser(); $userId = $user->get('id'); $task = JRequest::getString('task'); switch( $task ){ case "getArticles": $this->_getArticles(); break; } jexit(); } public function _getArticles(){ $query = "SELECT title FROM #__content WHERE catid = 11 ORDER BY id DESC"; $articlesList = JFactory::getDBO()->setQuery($query)->loadObjectList(); $html = ""; foreach( $articlesList as $article ){ $html .= '<div class="uk-margin">'. $article->title .'</div>'; } echo '<div id="articles-container" class="articles-container">'.$html.'</div>'; jexit(); } } ?> Then create a java script file with this JS script and add it to your page HEADER or just add it to your article php source: <script> jQuery(document).ready(function(){ jQuery('#ajax-button').click(function(){ jQuery.ajax({ url: 'index.php?option=com_content&format=ajax&lang=en&view=article&task=getArticles&tmpl=component', type: 'post', dataType: 'html', async: true, success: function(response){ jQuery(response).appendTo( jQuery('.uk-article') ); } }); }); }); </script>
Click the button above to see how it makes a jQuery Ajax call and adds Joomla articles titles to the bottom of the page.

Joomla Articles