1

我将 rails3-jquery-autocomplete 1.0.9 与 Rails 3.2.8 一起使用。

我正在尝试<select>用自动完成替换组合框 ( )。像组合框一样,如果用户选择了一个值,我想更新数据库中的一个 id。也像组合框一样,不应选择无效值。

一方面是,如果用户开始在字段中输入,但没有从选择列表中选择值就离开了字段,则字段本身以及相应的隐藏#to_contact_id 字段应该被清空。

以下是字段定义:

<%= autocomplete_field_tag "to_contact_name", '',
      autocomplete_contact_display_name_messages_path,
      :id_element => "#to_contact_id",
      :value => to_contact_name %>
<%= f.hidden_field :to_contact_id, :id => "to_contact_id" %>

我的计划是在用户从选择列表中选择一个项目时设置一个标志,然后检查模糊标志(失去焦点)。我在这里找到了一个覆盖自动完成功能的示例,并编写了这个 Javascript:

var picklist_value_selected = false;

$('input[data-autocomplete]').focus(function() {
  // add autocomplete event handler on focus
  $(this).autocomplete({
    select: function(event, ui) {
      picklist_value_selected = true;
    }
  });
});

$('input[data-autocomplete]').blur(function() {
  // If user leaves field without selecting value, clear values.
  if (!picklist_value_selected) {
    $(this).val('')
    $('#to_contact_id').val('');
  };
});

问题是,当我按上述方式覆盖 select时,“默认”功能不会执行,这意味着 #to_contact_id 一开始就不会被填写。

我假设我需要的是扩展select不是覆盖它,所以我的代码和 rails3-jquery-autocomplete 基本代码都执行了吗?我怎么做?像下面这样的各种尝试要么不会被调用,要么会抱怨未定义的方法:

$.extend($(this).autocomplete, {
  select: function(event, ui) {
    picklist_value_selected = true;
  }
});
4

1 回答 1

1

最好的方法是使用自动完成的更改事件。它在字段模糊时触发,如果值已更改,并且让您知道选择了哪个项目(如果有)。您可以像这样绑定到它:

$('input[data-autocomplete]').bind('autocompletechange', function(event, ui) {
    if(!ui.item) {
        // clear the fields
    }
});

更新:

由于我今天与它斗争了这么久,我仍然对知道如何扩展功能感兴趣。

这里。这是初始化自动完成的地方。select是作为自动完成选项传递的匿名函数。您可以像这样扩展它(希望代码是不言自明的):

var originalSelect = $('input[data-autocomplete]').autocomplete('option', 'select');
$('input[data-autocomplete]').autocomplete('option', 'select', function(event, ui) {
    originalSelect.call(this, event, ui);
    doSomeOtherStuff();
});

然而,这不是一个好的代码,因为select它是一个事件,所以如果你想在调用它时做更多的事情,你可以将另一个函数绑定到它。这样,原始函数和您的函数都将被调用而无需像我之前的示例中那样进行黑客攻击:

$('input[data-autocomplete]').bind('autocompleteselect', function(event, ui) {
    doSomeOtherStuff();
}); 
于 2012-10-27T02:53:07.537 回答