Rails 使用自动完成标记
Rails Tagging with autocomplete
我正在努力完成这篇关于标记的文章
https://medium.com/@sherzelsmith/add-a-filtering-multiple-tag-system-with-autocomplete-to-your-rails-model-in-rails-5-1bf88cd53e9
我的问题是我需要创建不存在的可能,但现在如果你试图用新标签(目前不存在)填充它,它会清除该字段,所以没有新标签可以通过此方法创建。
本文的作者部署了此功能的演示,因此我将其留在此处以便更好地理解我在说什么。
https://blogit-ss.herokuapp.com/posts/new
<div class = 'col-md-8 offset-2'>
<h1 class = "text-center">New Tag</h1>
<%= simple_form_for @product, url: product_path(@product) do |f| %>
<p><small>Tags: <%= raw @product.tags.map(&:name).map { |t| link_to t, tag_path(t) }.join(', ') %></small</p>
<p><%= f.input :tag_ids, collection: Tag.order(:name), include_blank: true, input_html: { multiple: true, class: 'chosen-select' } %></p>
<%= f.submit "Next", class: 'btn btn-primary' %>
<% end %>
</div>
所以也许这里有人对如何避免 'no results match' 并让表单接受新标签有什么建议?就像它在 Whosebug 上的工作原理一样。
最接近我的目标的唯一方法 - text_field in form_for:
<%= f.text_field :tag_list, 集合: Tag.order(:name), include_blank: true, input_html: { multiple: true, class: 'chosen-select' } %>
它允许输入以逗号分隔的标签名称,但没有自动完成功能。
您好,我添加了另一个可标记的下拉列表,这是有效的 link
Working link for add customizable tag
下面是 link GitHub
上的代码
Jad Chahine 对类似问题的回答中涵盖了这个问题的最佳解决方案
只需将 bootstrap-tagsinput 库添加到我的项目并将 data-role 传递到我的输入字段(虽然现在它没有自动完成,但适合开始):
<div class = 'col-md-8 offset-2'>
<h1 class = 'text-center'>New Blog Post</h1>
<%= simple_form_for @product, url: tag_link_product_url(@product), remote: true do |f| %>
<p><small id='tag_links'>Tags: <%= raw @product.tags.order(:name).map { |tag| link_to tag.name, products_path(q: { tags_id_eq: tag.id }) }.join(', ') %></small</p>
<%= f.text_field :tag_list, collection: Tag.order(:name), 'data-role': 'tagsinput', input_html: { multiple: true, class: 'chosen-select' } %>
<%= f.submit "Next", class: 'btn btn-primary' %>
<% end %>
</div>
我正在努力完成这篇关于标记的文章
https://medium.com/@sherzelsmith/add-a-filtering-multiple-tag-system-with-autocomplete-to-your-rails-model-in-rails-5-1bf88cd53e9
我的问题是我需要创建不存在的可能,但现在如果你试图用新标签(目前不存在)填充它,它会清除该字段,所以没有新标签可以通过此方法创建。
本文的作者部署了此功能的演示,因此我将其留在此处以便更好地理解我在说什么。
https://blogit-ss.herokuapp.com/posts/new
<div class = 'col-md-8 offset-2'>
<h1 class = "text-center">New Tag</h1>
<%= simple_form_for @product, url: product_path(@product) do |f| %>
<p><small>Tags: <%= raw @product.tags.map(&:name).map { |t| link_to t, tag_path(t) }.join(', ') %></small</p>
<p><%= f.input :tag_ids, collection: Tag.order(:name), include_blank: true, input_html: { multiple: true, class: 'chosen-select' } %></p>
<%= f.submit "Next", class: 'btn btn-primary' %>
<% end %>
</div>
所以也许这里有人对如何避免 'no results match' 并让表单接受新标签有什么建议?就像它在 Whosebug 上的工作原理一样。
最接近我的目标的唯一方法 - text_field in form_for:
<%= f.text_field :tag_list, 集合: Tag.order(:name), include_blank: true, input_html: { multiple: true, class: 'chosen-select' } %>
它允许输入以逗号分隔的标签名称,但没有自动完成功能。您好,我添加了另一个可标记的下拉列表,这是有效的 link
Working link for add customizable tag
下面是 link GitHub
上的代码Jad Chahine 对类似问题的回答中涵盖了这个问题的最佳解决方案
只需将 bootstrap-tagsinput 库添加到我的项目并将 data-role 传递到我的输入字段(虽然现在它没有自动完成,但适合开始):
<div class = 'col-md-8 offset-2'>
<h1 class = 'text-center'>New Blog Post</h1>
<%= simple_form_for @product, url: tag_link_product_url(@product), remote: true do |f| %>
<p><small id='tag_links'>Tags: <%= raw @product.tags.order(:name).map { |tag| link_to tag.name, products_path(q: { tags_id_eq: tag.id }) }.join(', ') %></small</p>
<%= f.text_field :tag_list, collection: Tag.order(:name), 'data-role': 'tagsinput', input_html: { multiple: true, class: 'chosen-select' } %>
<%= f.submit "Next", class: 'btn btn-primary' %>
<% end %>
</div>