Rails - 下拉菜单和自由文本输入的组合

Question

我正在使用 Rails 4.2.1 和 ruby 2.1.6

我正在寻找执行以下操作的解决方案：
有一个包含现有地区列表的下拉列表（德国联邦）。如果我在该列表中找到我的区域，从下拉列表中找到 select，我就没事了。
如果找不到我所在的地区，我需要在文本字段中手动输入新地区。这也将在数据库中创建一个新条目。
为了让这个用户友好且易于使用而无需在字段之间切换，我更愿意尽可能将其放在一个字段中。

这是我实际下拉菜单的代码，但没有任何选项自由文本和手动输入。

<br>
= ai3.input :area_id, label: "Bundesland/Kanton", :as => :select, :collection => option_groups_from_collection_for_select( @area_countries_dach, :area_regions, :name, :id, :name)

现在需要将其扩展为 select 框（下拉列表）和自由文本输入字段的组合。

让用户在字段中键入区域的起始字符会很棒。如果找到，请单击或离开该字段 select。如果未找到，请使用已键入的字符创建新区域。

关于如何解决这个问题有什么想法吗？谢谢

Answer 1

如果区域未在 drop-down.

中找到

如下所示

<div id="show_region" class="btn btn-primary">Cant Find Your Region? Manually Add It Here</div>
<%= ai3.input :some_attribute, :class => 'form-control', :id => 'input_region', placeholder: 'Enter your region' %>

Javacsript

<script type="text/javascript">
$('#input_region').hide();
$(document).ready(function() {
  $('#show_region').click(function() {
    $('#input_region').slideToggle("slow");
  });
});
</script>

但是你不能保存在相同的属性AFAIK。您需要 不同的属性 text_field。

It would be great to have the user typing into the field the beginning chars for the region. if found, select by click or leaving the field

这需要 自动完成 text_field 而不是正常的 text_field。看看 here 如何实现它。

Answer 2

如 Pavan 所述，自动完成文本字段在这种情况下效果很好。我运行最近遇到了同样的事情，并为此使用了 Twitter typeahead。
https://github.com/yourabi/twitter-typeahead-rails

其他地方对此有很多讨论。

Rails - 下拉菜单和自由文本输入的组合

Rails - Combination of Dropdown and Free-Text-Input

combobox

ruby-on-rails

dropdownbox