使用Ajax将数据加载到Joomla3.1组件中的<div>中

Question

一段时间以来，我一直在试图弄清楚这一点，尽管我在网上发现了很多例子，但它们都被完全搞糊涂了，因为似乎没有一个能与我所做的完全相符。

我有一个Joomla组件，我正在建设和一个单一的视图在前端。在默认模板('default.php')中创建两个divs。一个包含一个项目列表，另一个是空白。我有代码，让我点击其中一个列出的项目，并返回一个唯一的ID，该项目。然后，我想获取该ID，并在Ajax调用中使用它从数据库中的表中检索一项数据。

该组件名为“com_pub”，它应该在每个组件上显示一个酒吧和信息列表。

我有一个名为controller (即'com_pub/controllers')的文件夹，其中有一个名为'pubitems.php‘的控制器，它只是扩展了JController类：

<?php
defined('_JEXEC') or die("Resricted Access!");

class PubControllerPubitems extends JController
{
}
?>

当我显示初始页面时，此操作正常。

我在前端的“控制器”文件夹中创建了一个名为“pubitems.json.php”的新控制器，它包含以下代码：

<?php
defined('_JEXEC') or die;

class ContentFetchPubitems extends JController
{   

public function RetrieveContent()
{
 echo(json_encode($data));
 return;
}
}

我还在“tmpl”文件夹中创建了一个文件“content_response”：

<?php

echo "Dummy Response";

?>

在我的'default.php‘文件(位于视图的'tmpl’文件夹中)中，我有一个脚本，它使用JQuery从列表中获取所选的id，然后进行Ajax调用：

<script>
jQuery(".tocli").click(function(){
alert(this.id);
url = 'index.php&option=com_pub&controller=pubitems&task=RetrieveContent&tmpl=content_response&format=raw&dataType=json';
var jqxhr = jQuery.ajax(url,function(result){                     
alert("success");
})
.fail(function() {
alert( "Error: " );
})
.always(function() {
alert( "Finished: " + jqxhr.statusText);
});              
});
</script>

Ajax调用所指向的函数显然要做的不仅仅是回送一条消息，并在我完成基本工作时从数据库中获取数据。

jQuery确实返回了变量'this.id‘，并且在警报中正确地显示了这一点，但是我现在甚至没有试图在Ajax调用中发送这个变量--我只是想让调用在一个基本级别上运行(如果这是有意义的话)。

另一个警报工作正常，但“.success”一个没有触发，“.always”一个显示“已完成:未找到”，而HTTPFox显示它是一个404 error。

因此，我认为这意味着Ajax调用甚至没有进入“content_response”文件，而且url中的某些内容是错误的。根本的问题是，我并没有真正意识到网址的构造(可能还有其他的问题--我还在学习)。我试过改变网址中的各种元素，但没有取得任何成功。

我也不清楚是否正确设置了控制器和其他文件。似乎有很多不同的方法来做这件事，我看到的很多东西都与其他帖子相矛盾，这让我很困惑。

我很抱歉，这是一个很长的职位，但我试图尽可能清楚地知道我正在做什么，我做了什么，到目前为止。任何关于这方面的指导，谁真正理解Joomla 3.1将是非常感谢。

这是一个更新的基础上，我做了额外的工作后，非常有帮助的评论，从Lodder谁发现了一个错误的网址。我不确定我是否应该这样做，但如果我没有，可能有人会告诉我。

一旦我更正了URL，我就根据尝试和错误以及更多的web搜索做了一些其他的更改：

1)我删除了对模板(tmpl=content_response)的引用，因为我突然意识到，我试图使用jQuery将ajax调用的结果插入到现有页面中，因此不想加载不同的模板。

2)我更改了url的'task‘元素，以包括控制器的名称以及我正在调用的函数(所以是task=pubitems.RetrieveContent而不是task=RetrieveContent)。

3)我去掉了网址中的“dataType=json”部分，但把“format=raw”留在了。

4)创建了一个名为pubitems.raw.php的新控制器，用于保存RetrieveContent函数。

5)我在警报中添加了一些信息，以查看是否可以获得有关ajax过程的更多信息。

所以现在我只在default.php模板中有了这个脚本，它看起来像：

<script>
jQuery(".toc,li").click(function(){
alert(this.id);
var data_to_send = {'id': this.id};
alert(data_to_send);
url = 'index.php?option=com_pub&controller=pubitems&task=pubitems.RetrieveContent&data=data_to_send&format=raw';
var jqxhr = jQuery.ajax(url)
.done(function(result) {
alert("Success: " + jqxhr.status + " " + jqxhr.statusCode() + " " + jqxhr.statusText);
})
.fail(function(result) {
alert("Error: " + jqxhr.status + " " + jqxhr.statusCode() +" " + jqxhr.statusText);
})
.always(function(result) {
alert("Finished: " + result);
}); 
});
</script>

新的控制器如下所示：

<?php
defined('_JEXEC') or die("Resricted Access!");

class PubControllerPubitems extends JControllerForm
{
public function RetrieveContent()
{
$app = JFactory::getApplication();
$post_data = $app->input->get('id');
//  $post_data="This is a test";

echo($post_data);
}
}
?>

如果我不注释掉$post_data=的“这是一个测试”行，我就会得到ajax调用返回的‘这是一个测试’，一切都运行得很好。如果我注释掉它，我将一无所获，所以无论是在从default.php模板发出ajax调用时，还是在pubitems.raw.php控制器中的函数中，ajax调用都有问题。我仍在努力弄清楚这一点，但欢迎任何额外的帮助。

Answer 1

我终于让这一切与一个持续不断的试错和大量使用谷歌的过程一起工作。

控制器如下所示：

<?php
defined('_JEXEC') or die("Resricted Access!");

class PubControllerPubitems extends JControllerForm
{
public function RetrieveContent()
{
$input = JFactory::getApplication()->input;
$cont_num = $input->get('pub_num', '', 'post');

$db = JFactory::getDBO();
$query = $db->getQuery(true);
$query->select('*');
$query->from('#__pub'); 
$query->where('pubid = ' . $pub_num); 


$db->setQuery($query); 

if ($db->getErrorNum()) {
     $return_Data = $db->getErrorMsg();
     $return_data = "Database Error";
     }
 else 
    {
    $list = $db->loadObjectList();
    foreach ($list as $item) {
    pub_txt = $item->info;
    $return_data = "Database Access Succeeded";
    $return_data = $pub_txt;
    }
    }

echo($return_data);
}
}
?>

我现在已经发现，在Joomla3.1中，数据库错误应该被捕获的方式是不可取的，它们应该作为异常来处理，但是这个版本的工作方式还不错。

我从模板中重复了整个脚本部分，这样就可以清楚地知道是否还有其他人想做同样的事情：

<script>
jQuery(".toc li").click(function(){
var data_to_send = {pub_num: this.id};
url = 'index.php?option=com_pub&controller=pubitems&task=pubitems.RetrieveContent&format=raw';
var jqxhr = jQuery.ajax(url,{
data: data_to_send
    })
    .done(function(result) {
    alert("Success: " + jqxhr.status + " " + jqxhr.statusCode() + " " + jqxhr.statusText);
    jQuery('#name-box').empty();
    $pub_txt = jqxhr.responseText;
    jQuery('#name-box').text($pub_txt);
    })
.fail(function(result) {
alert("Error: " + jqxhr.status + " " + jqxhr.statusCode() +" " + jqxhr.statusText);
})
.always(function(result) {
    alert("Finished: " + jqxhr.responseText);
});
});
</script>

我留下了警报，因为当我试图弄清楚到底发生了什么时，我发现这些很有帮助。

我改变了很多东西，并尝试了它们，但最终我认为关键的事情是：

在调用RetrieveContent函数时，我包含了控制器的名称，因此它是Task= pubitems.RetrieveContent。

我改变了我编码数据的方式。这是很难从我可以在网上找到的信息，我到达那里，通过试验和错误。

我不再试图通过将数据包含在url中来发送数据。相反，我将其分别包含在ajax调用'data: data_to_send‘中。在我想出一种为ajax调用编码数据的方法之前，我已经这样做了。

我希望这对其他人有所帮助。我花了很长时间才做完这件事，当然，现在我已经做得很简单了，但希望这能为其他人节省很多时间。

Answer 2

您应该指定JInput请求的数据类型。

$cont_num = $input->get('pub_num', 'INT', 'post');

永远不要信任输入，即使当您使用CSRF令牌时，您仍然应该强制输入。到目前为止，它可能并不是必需的，但它是一个好习惯(也是我的编码指南中的一个要求)。