Drupal 自动完成提交选择建议

Question

我已按照此站点上的教程进行操作： http:// /thedrupalblog.com/creating-autocomplete-field-using-forms-api-and-menu-callback 并使我的自动完成功能运行良好。

我不确定如何做并且似乎无法在网上找到的是当用户单击建议时提交表单，而不是简单地填写该字段。

提前致谢。

Answer 1

以下代码将覆盖“Drupal.jsAC.prototype.select”函数，并且可以在任何 JS 文件中使用它，而无需修改 misc/autocomplete.js。

 $(document).ready(function(){
      Drupal.jsAC.prototype.select = function (node) {
        this.input.value = $(node).data('autocompleteValue');
        if(jQuery(this.input).hasClass('auto_submit')){
          this.input.form.submit();
        }
      };
    });

Answer 2

这可能不是最好的“drupal”方法，也许有人可以改进它......

在你的“misc/autocomplete.js”文件中找到：

Drupal.jsAC.prototype.select = function (node) {
  this.input.value = $(node).data('autocompleteValue');
}; 

并将其更改为：

Drupal.jsAC.prototype.select = function (node) {
  this.input.value = $(node).data('autocompleteValue');
  if(jQuery(this.input).hasClass('auto_submit')){
      this.input.form.submit();
  }
};

然后在你的表单项上添加：

'#attributes' => array('class'=> array('auto_submit')),

这将导致无论用户选择如何选择（输入按钮或鼠标单击）都要提交表单

编辑：4年后我投票并意识到这需要更新......基本上@Azhar是对的，而不是编辑现有文件，应将此代码添加到在 autocomplete.js 之后加载的新 JS 文件中。

每当您编辑核心时，您都会遇到不得不担心核心安全更新的情况，这会覆盖您的更改并导致您的网站损坏，而您则需要再次修复它。

Answer 3

仅当您单击自动完成建议时，此功能才有效，而通过键盘选择它时则无效。

要捕获键盘和鼠标选择，请重写 hidePopup 方法。

// Autosubmit on keyboard & click.
Drupal.jsAC.prototype.hidePopup = function (keycode) {
    // Select item if the right key or mousebutton was pressed.
    if (this.selected && ((keycode && keycode != 46 && keycode != 8 && keycode != 27) || !keycode)) {
      this.input.value = $(this.selected).data('autocompleteValue');
      if (jQuery(this.input).hasClass('auto-submit')) {
        this.input.form.submit();
      }
    }
    // Hide popup.
    var popup = this.popup;
    if (popup) {
      this.popup = null;
      $(popup).fadeOut('fast', function () { $(popup).remove(); });
    }
    this.selected = false;
    $(this.ariaLive).empty();
  };

Answer 4

或者，如果您想在所有自动完成表单上启用它，而不必使用表单更改，则可以在 JS 文件中使用以下代码片段：

Drupal.jsAC.prototype.select = function (node) {
  this.input.value = $(node).data('autocompleteValue');
  if(jQuery(this.input).hasClass('form-autocomplete')){
    this.input.form.submit();
  }
};

Answer 5

自 7.36 /
问题 #365241，通过触发 autocompleteSelect 事件可以更好地支持此问题关于选择。

如果您使用 Ajax 框架，您可以捕获此事件以及三种主要类型的字段提交（单击、输入、更新值上的 Tab）的更改事件，例如：

$field = array(
    // ...
    '#ajax' => array(
      // ...
      'event' => 'change autocompleteSelect',
    ),
);

否则，您可以从自定义脚本捕获该事件。它是在编辑元素（更新后）上触发的，并带有所选节点的单元素数组的附加参数。

Answer 6

假设您有两个字段，例如标题、描述。我们假设这两个字段中都没有 html 标签。我们设置了一个视图来列出标题和描述。我们还有一个标题作为具有自动完成功能的公开过滤器。

jQuery('html').on('click touchstart','.ui-autocomplete li a', function(e){
          var text = jQuery(this).html();
          jQuery('.form-autocomplete').val(text);
          jQuery('.form-autocomplete').parent().parent('form').submit();
      }); 

最详细的版本位于 https://www.drupal.org/node/2852380