Tom
Tom

Reputation: 2634

Using jquery with Ajax in a Joomla 2.5 component

I'm having difficulty figuring out where I put my Ajax and server code in a Joomla component. I've created a simple hello world component following the Joomla part 2 docs (I don't need any of the other stuff just a simple component).

Now I'm trying to add Ajax code with jquery using a simple jquery/ajax tutorial. So I added this code to:

components/com_mycomponent/views/mycomponent/tmpl/default.php

<?php
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
?>
<html>
<head>
  <title>Ajax with jQuery Example</title>

<script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/JavaScript">
  $(document).ready(function(){
    $("#generate").click(function(){
      $("#quote p").load("script.php");
    });
  });
  </script>
<style type="text/css">
    #wrapper {
      width: 240px;
      height: 80px;
      margin: auto;
      padding: 10px;
      margin-top: 10px;
      border: 1px solid black;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="wrapper">
    <div id="quote"><p> </p></div>
    <input type="submit" id="generate" value="Generate!">
  </div>
</body>
</html>

In the same directory I added the script.php file for the server side processing. Again, just from the tutorial:

<?php  
header("Cache-Control: no-cache");  
// Ideally, you'd put these in a text file or a database.    
// Put an entry on each line of 'a.txt' and use $prefixes = file("a.txt");  
// You can do the same with a separate file for $suffixes.  
$prefixes = array('Mashup','2.0','Tagging','Folksonomy');  
$suffixes = array('Web','Push','Media','GUI');  
// This selects a random element of each array on the fly  
echo $prefixes[rand(0,count($prefixes)-1)] . " is the new "    
   . $suffixes[rand(0,count($prefixes)-1)];  
// Example output: Tagging is the new Media  
?> 

I'm guessing the way I specify script.php is not right because I get the generate button when I access the component:

http://mysite.com/index.php?option=com_mycomponent

EDIT: Didn't notice the error which is pretty crucial. I get a Not Found error: http://mysite.com/script.php. Which is obviously not there. Where do I put this for my component? Keeping in mind that the whole point of creating a component with ajax is so that I can have the joomla framework available in script.php. For example doing calls such as: $user =& JFactory::getUser();

Thanks in advance.

Upvotes: 0

Views: 7671

Answers (3)

A Z
A Z

Reputation: 21

1- put the contents of script.php in a public function in your components main (important) controller e.g. ajaxit().

2- modify your click handler to the following:

$.ajax({
   url: 'index.php?option=com_mycomponent&view=mycomponent&task=ajaxit&format=raw',
   success: function(data) {
       $('#quote p').html(data);
   }

});

Upvotes: 2

Anand
Anand

Reputation: 1680

try using

components/com_mycomponent/views/mycomponent/tmpl/script.php in load function

Upvotes: 0

Arkheart
Arkheart

Reputation: 36

Instead of using the .Load() method, try using this inside your click handler.

$.ajax({
  url: 'script.php',
  success: function(data) {
    $('#quote p').html(data);
  }
});

Upvotes: 0

Related Questions