如何添加 AJAX 动作 - Elgg

Question

我正在尝试在 elgg 中创建一个 AJAX 操作。我遵循了这个 Elgg 教程：Ajax: Performing actions，但到目前为止我什么也没得到，除了失败错误：

Sorry, Ajax only!

另一个错误是页面重新加载，而不是异步保存数据。

我做错了什么？提前谢谢大家。

下面是我的代码：

表单： views/default/forms/service_cmets/add.php

<?php
    $url_confirm = elgg_add_action_tokens_to_url("action/service_comments/add?guid={$guid}");
    $params_confirm = array(
        'href' => $url_confirm,
        'text' => elgg_view_icon('upload'),
        'is_action' => true,
        'is_trusted' => true,
        'class' => 'upload-media-update',
        );

    $confirm = elgg_view('output/url', $params_confirm);
?>

<div class="update-options">
    <?= $confirm ?>
</div>

start.php

elgg_register_action("service_comments/add", __DIR__ . "/actions/service_comments/add.php");

动作文件： actions/service_cmets/add.php

<?php

    elgg_ajax_gatekeeper();

    $arg1 = (int)get_input('arg1');
    $arg2 = (int)get_input('arg2');

    // will be rendered client-side
    system_message('We did it!');

    echo json_encode([
        'sum' => $arg1 + $arg2,
        'product' => $arg1 * $arg2,
        ]);

Javascript： views/js/service_cmets/add.js

var Ajax = require('elgg/Ajax');
var ajax = new Ajax();

ajax.action('service_comments/add', {
  data: {
    arg1: 1,
    arg2: 2
  },
}).done(function (output, statusText, jqXHR) {
  if (jqXHR.AjaxData.status == -1) {
    return;
  }
  alert(output.sum);
  alert(output.product);
});

Answer 1

您已经编写了 ajax 程序但没有调用它。相反，您直接调用它。通过使其链接。

    $params_confirm = array(
    'href' => '#',
    'text' => elgg_view_icon('upload'),
    'onclick' => "myajax_function()",
    'class' => 'upload-media-update',
    );

$confirm = elgg_view('output/url', $params_confirm);

然后将你的 JS 代码移动到一个函数中。

function myajax_function(){
  var Ajax = require('elgg/Ajax');
  var ajax = new Ajax();

  ajax.action('service_comments/add', {
           data: {
           arg1: 1,
           arg2: 2
       },
  }).done(function (output, statusText, jqXHR) {
         if (jqXHR.AjaxData.status == -1) {
      return;
  }
  alert(output.sum);
  alert(output.product);
 });
}