如何在 Joomla 组件中使用 Jquery AJAX？答案

【问题标题】：how to use Jquery AJAX in Joomla Components?如何在 Joomla 组件中使用 Jquery AJAX？
【发布时间】：2011-03-10 14:33:17
【问题描述】：

我正在 Joomla 中开发网站，同时我遇到了一个问题，请帮助我解决以下问题

这是我的组件文件夹结构

htdocs/Joomla/administrator/component/com_test/test.php,controller.php
                                              models/test.php
                                              controllers/test.php
                                              views/test/view.html.php
                                              view/test/tmpl/default.php

现在在view.html.php 我创建了一个表单，我在其中使用 jquery ajax 代码进行用户名可用性检查

但我不知道如何将所有东西结合起来以获得用户名可用或不可用的结果

这是我写在 test/view.html.php

上的代码

<script type="text/javascript">
 jQuery(document).ready(function(){
 jQuery("#username").change(function () {
    var usr = jQuery("#username").val();
    if (usr.length >= 2) {
     jQuery("#status").html('<img src="loader.gif" align="absmiddle">&nbsp;Checking availability...');
     jQuery.ajax({
         type: "POST",
         url: "index.php?option=com_test&view=check_user",
         data: "username=" + usr,
         success: function (msg) {
         jQuery("#status").ajaxComplete(function (event, request, settings) {
         if (msg == 'OK') {
            jQuery("#username").removeClass('object_error'); // if necessary
                jQuery("#username").addClass("object_ok");
         }
         else {
               jQuery("#username").removeClass('object_ok'); // if necessary
               jQuery("#username").addClass("object_error");
               jQuery(this).html(msg);
         }
       });
      }
    });
  }    
});

<script>

<form action="" method="post" name="addUserForm" id="addUserForm" > 
   <table width="100%" border="0" cellpadding="4" cellspacing="2">
     <tr>
    <th >User Name :</th>
        <td ><input type="text" name="username" id="username" size="50">
             <span id="status"></span>  
        </td>
     </tr>      
   </table>
</form>

我已经为上述操作创建了下面的文件夹结构，请告诉我我哪里出错了

view/check_user/view.html.php
views/check_user/tmpl/default.php

check_user/view.html.php

中的代码

<?php

// no direct access
defined('_JEXEC') or die('Restricted access');

jimport( 'joomla.application.component.view');

/**
 * HTML View class for the advertising component
 */
class TestViewCheck_user extends JView 
{
   /**
    * Default display function
    */  
    function display($tpl = null) 
    {
        $testController = new TestController();
        // Make an object of Main Model class contains Main functions
        $testModel = $testController->getModel('test');
        $userName  = JRequest::getVar('username');
        parent::display($tpl);
        }
 }
?>

但是当我运行这段代码时...为什么 http://localhost/Joomla/includes/js/joomla.javascript.js 文件无限运行.. 最后给出 4 个错误

现在我必须修改/添加更多内容？？？请指导我....

参考任何有用的链接，教你逐步创建组件...这对我很有帮助

非常感谢

【问题讨论】：

标签： php jquery ajax joomla

【解决方案1】：

我找到了解决方案。您必须阻止 joomla 将模板和模块和...附加到您的输出 ajax 数据。为此，您必须在显示数据后添加此代码

//after $this->display($tpl);

global $mainframe;

$mainframe->close();

【讨论】：

哇！谢啦！这真的很有帮助！我让用户通过我的组件下载文件，而 Joomla 用于在图像内容之前和之后输出 html，因此它最终变得“不可读”。添加 $mainframe->close();在标题挽救了一天之后！再次感谢！

【解决方案2】：

所有前端代码都应该在您的 tmpl 中，因此您的 Ajax 内容也应该在其中。查看本教程，了解如何为 Joomla ~~http://www.joomladevuser.com/tutorials/components~~（死链接）制作 MVC 组件。

【讨论】：

不幸的是死链接

【解决方案3】：

在 joomla 1.7 及更高版本中，您可以像这样关闭它

$app = &JFactory::getApplication();
$app->close();

【讨论】：

【解决方案4】：

没错，Joomla 将加载模块、组件、whatewer 您的默认模板和 Joomla 核心需要... 使用“&format=raw”更改此行为（这将强制 Joomla 包含 Joomla 的“无”）或“&template=your_own_template_for_ajax”（这将强制 Joomla 包含您自己的“无”）。

我不知道“&format=raw”，所以我使用自己的空模板进行 ajax。空模板对我来说很有意义 - 我可以按照我想要的方式自定义它（例如，默认包含一些东西）。 "&format=raw" 是一个不错的选择，但不是唯一的选择。这个决定取决于你默认想要做什么/得到什么。

如何在前端制作这样的ajax模板？

您必须在前端 \templates\ 目录中创建一个新目录（例如“ajax”）。然后在里面放3个文件：

index.php：

<jdoc:include type="component" />

templateDetails.xml：

...XML content..

可以在此处找到有关如何正确创建 templateDetails.xml 的说明：
http://docs.joomla.org/Creating_a_basic_templateDetails.xml_file

index.php：

<!DOCTYPE html><title></title>

这就是前端解决方案所需的全部内容。

通过这样的调用来测试它： http://www.example.com/index.php?template=ajax

这是前端的 100% 工作解决方案。后端未经我测试。我相信您还必须为后端创建一个单独的模板。或者以某种方式到达前端模板（目前不知道如何）...

【讨论】：

【解决方案5】：

1 - 复制 joomla 的主 index.php (joomlaRoot/index.php) 并将其重命名为任意名称（例如：joomlaRoot/ajax.php）。

2 - 禁用渲染方法 ($mainframe->render();)

3 - 在渲染方法行下复制这段代码：

/***/
$document =& JFactory::getDocument();
$content=$document->getBuffer();
foreach($content as $var){
    foreach($var as $var2){
        echo $var2;
    }
}

/**/

【讨论】：

【解决方案6】：

你可以使用：

url: "index.php?option=com_test&view=check_user&<strong>format=raw</strong>",

这将阻止加载整个模板，但只会加载组件的输出，这是您在调用 ajax 函数时真正想要的。

另外，您可以查看index2.php（而不是index.php），它以类似的方式设计以提供简单的输出，无需渲染整个模板。

【讨论】：

【解决方案7】：

在 ajax url 中使用 format=raw，因为这只会显示没有任何模板的输出。

【讨论】：

【解决方案8】：

以上所有给定的解决方案（Joomla 3.1）对我没有任何帮助。所以我使用了这个解决方案。在 url 中添加 tmpl=component。

index.php?option=com_photos&view=intphoto&id=1&tmpl=component

【讨论】：