Question

如何在点击Drupal中的链接时使用AJAX提交表单？

function search_form($form,$form_state) {
  $form['support_email'] = array(
    '#theme' => 'link',
    '#text' => '',
    '#ajax' =>array(
      'callback' => 'ajax_change',
      'wrapper' => 'email-hidden',
      'method' => 'replace',
      'click' => 'true',
    ),
  );
}

这是我在表单中的表单链接。在单击链接时，我希望调用AJAX回调函数ajax_change，这似乎不会发生。

Answer 1

#ajax功能的表单api参考说明它是“使用者：按钮，复选框，复选框，图像按钮，密码，广播，无线电，选择，提交，tableselect，textarea，text_format，textfield” 。链接不在列表中，因此不起作用。 #ajax功能使Drupal在指定的表单元素更改时执行AJAX调用。由于链接不会改变，因此它不起作用是合乎逻辑的。

Asaf (ajax submit for any form)模块可以帮助您实现您想要的目标。

此外，您似乎正在尝试使用此AJAX来隐藏元素。 Forms API具有states功能，可以轻松有条件地显示/隐藏元素。有关状态的详细信息，请阅读this。

#ajax回调用于制作动态变化的表单。

Answer 2

在Drupal中，不可能（不使用第三方模块）将链接标记用作AJAX触发元素。替代解决方案可能是创建一个具有AJAX功能的隐藏按钮元素，并在该隐藏按钮上进行链接触发点击事件。

这是表单功能：

function mymodule__form($form, $form_state) {
  // JS file contains the code for triggering click event on e hidden button.
  $form['#attached']['js'][] =
    drupal_get_path('module', 'mymodule') . '/js/mymodule.behaviors.js';

  // Our link element.
  $form['link_mymodule'] = array(
    '#type' => 'link',
    '#name' => 'link_mymodule',
    '#title' => t('Perform mymodule logic'),
    '#href' => current_path(),
    '#options' => array(
      'attributes' => array(
        'class' => array('mymodule_ajax'),
      ),
    ),
  );

  // Hidden AJAX enabled submit button.
  $form['mymodule_ajax_submit'] = array(
    '#type' => 'button',
    '#value' => 'AJAX submit',
    '#name' => 'mymodule_ajax_submit',

    // You may need this to disable validation.
    '#limit_validation_errors' => array(),

    '#ajax' => array(
      'callback' => '_mymodule__form__pager_callback',
      'event' => 'click',
    ),
    '#attributes' => array(
      // Class "element-hidden" will hide the button.
      'class' => array('element-hidden', 'mymodule_ajax_submit'),
    ),
  );

  // Some element for tests.
  $form['random_thing'] = array(
    '#type' => 'markup',
    '#markup' => rand(1, 10000),

    // Wrapper is needed since AJAX will use it as a container for incoming data.
    '#prefix' => '<div class="ajax_wrapper">',
    '#suffix' => '</div>',
  );

  return $form;
}

由于您使用的是AJAX，因此您还需要使用回调函数替换旧数据：

function _mymodule__form__pager_callback($form, &$form_state) {
  return array(
    '#type' => 'ajax',
    '#commands' => array(
      ajax_command_replace('.ajax_wrapper', trim(render($form['random_thing']))),
    ),
  );
}

此外，您必须将点击事件附加到您的链接，这将触发隐藏按钮上的点击事件。这就是存储在/js/mymodule.behaviors.js文件中的内容。

(function ($, Drupal) {
  Drupal.behaviors.mymodule = {
    attach: function (context, settings) {

      // Since behaviors will be executed every times AJAX is called, it's better to use $.once() method even if you
      // are going to use "context" argument. That is needed to be sure that event is attached only once.
      $('.mymodule_ajax', context).once('mymodule_ajax', function () {

        // Bind click event to out link.
        $(this).click(function (e) {
          // Prevent browser to follow the link.
          e.preventDefault();

          // Perform click triggering.
          $('input.mymodule_ajax_submit').click();
        });

      });

    }
  }
}(jQuery, Drupal));

drupal ajax从表单中的链接点击调用

2 个答案: