尝试使用typeahead自动完成act-as-taggable-on标记列表

时间:2015-12-28 00:17:23

标签: ruby-on-rails bootstrap-typeahead acts-as-taggable-on

我的网站上有一个页面,其中包含一个允许用户向项目添加标签的表单。我想合并typeahead,以便当用户开始在输入框中键入标签时,会出现一个下拉列表,其中包含与该字符串匹配的现有标签。我想我可以使用basic example完成此任务,但它似乎无法正常工作。

这是我的脚本显示页面:

<div id="add-tag-form">
  <%= form_tag add_tag_path, id: "custom-tag",
        class: "form-group",
        autocomplete: "off",
        remote:true
  do %>
    <%= text_field_tag :tag, nil, placeholder: 'Add tag', class: "form-control typeahead", id: 'add-tag' %>
    <%= submit_tag 'Add' %>
    <span id = "tag-block" class="help-block"></span>
  <% end %>
</div>

<script>
  $(document).ready(function(){
    var substringMatcher = function(strs) {
      return function findMatches(q, cb) {
        var matches, substringRegex;

      // an array that will be populated with substring matches
      matches = [];

      // regex used to determine if a string contains the substring `q`
      substrRegex = new RegExp(q, 'i');

      // iterate through the pool of strings and for any string that
      // contains the substring `q`, add it to the `matches` array
      $.each(strs, function(i, str) {
        if (substrRegex.test(str)) {
          matches.push(str);
        }
      });

      cb(matches);
    };
  };

  var tags = Tag.all.pluck(:name);

  $('#add-tag-form .typeahead').typeahead({
    hint: true,
    highlight: true,
    minLength: 1
  },
  {
    name: 'tags',
    source: substringMatcher(tags)
  });
});
</script>

在控制台中,我得到Uncaught SyntaxError: unexpected token :,它指向行var tags = Tag.all.pluck(:name);中的:name。我的想法是ruby没有被脚本标签识别,但我可能是错的。这样做的正确方法是什么?

另外,我是否需要脚本开头的$(document).ready行?

0 个答案:

没有答案