Drupal自动完成提交选择建议

时间:2011-05-19 20:14:26

标签: autocomplete drupal-7

我已按照此网站上的教程进行操作:http://thedrupalblog.com/creating-autocomplete-field-using-forms-api-and-menu-callback并让我的自动填充工作正常。

我不确定如何做并且似乎无法在线查找当用户点击建议而不是简单地填写该字段时,表单会提交。

提前致谢。

5 个答案:

答案 0 :(得分:10)

以下代码将覆盖“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();
        }
      };
    });

答案 1 :(得分:6)

这可能不是最好的“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是正确的,而不是编辑现有文件,这个代码应该添加到自动完成后加载的新JS文件的.js。

正如您编辑核心时一样,您必须担心核心安全更新会覆盖您的更改并使您的网站损坏,并且您会争先恐后地重新修复它。

答案 2 :(得分:1)

仅当您单击自动填充建议时才有效,而不是通过键盘选择它。

要捕获键盘和鼠标选择,请覆盖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();
  };

答案 3 :(得分:0)

或者,如果您想在所有自动填充表单上启用它而不必使用表单更改,您可以在JS文件中使用以下代码段:

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

答案 4 :(得分:-1)

假设您有两个字段,例如标题,说明。我们假设这两个字段中都没有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