如何使用 jquery-Tokeninput 和 Acts-as-taggable-on [英] How to use jquery-Tokeninput and Acts-as-taggable-on

查看:17
本文介绍了如何使用 jquery-Tokeninput 和 Acts-as-taggable-on的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是您如何使用 jQuery TokeninputActsAsTaggableOn.

This is how you use autocomplete with jQuery Tokeninput and ActsAsTaggableOn.

在我的情况下,我使用的是嵌套表单,但这无关紧要.下面的所有代码都是有效的.

In my situation i am using a nested form but it shouldnt matter. Everything below is code that works.

产品型号:

attr_accessible :tag_list # i am using the regular :tag_list
acts_as_taggable_on :tags # Tagging products

产品控制器:

  #1. Define the tags path
  #2. Searches ActsAsTaggable::Tag Model look for :name in the created table.
  #3. it finds the tags.json path and whats on my form.
  #4. it is detecting the attribute which is :name for your tags.

def tags 
  @tags = ActsAsTaggableOn::Tag.where("tags.name LIKE ?", "%#{params[:q]}%") 
  respond_to do |format|
    format.json { render :json => @tags.map{|t| {:id => t.name, :name => t.name }}}
  end
end

路线:

# It has to find the tags.json or in my case /products/tags.json
get "products/tags" => "products#tags", :as => :tags

Application.js:

Application.js:

$(function() {
  $("#product_tags").tokenInput("/products/tags.json", {
    prePopulate:       $("#product_tags").data("pre"),
    preventDuplicates: true,
    noResultsText:     "No results, needs to be created.",
    animateDropdown:   false
  });
});

表格:

<%= p.text_field :tag_list,
                 :id => "product_tags",
                 "data-pre" => @product.tags.map(&:attributes).to_json %>


问题 1(已解决)


必须有一行:


Issue 1(SOLVED)


Must have the line:

format.json { render :json => @tags.collect{|t| {:id => t.name, :name => t.name }}}

注意 - 您也可以在此处使用 @tags.map 并且您也不必更改表单.

Note - You can use @tags.map here as well and you dont have to change the form either.

以下是关于您为什么需要这样做的两个问题:

Below are the 2 issues on why you needed to do this:

我有以下 Tag:{id":1,name":Food"}.当我保存一个 Product,标记为 "Food" 时,当它搜索并找到名称 时,它应该保存为 ID: 1食物".目前,它使用引用 Food" ID 的新 ID 保存新的 Tag,即 {id":19,name";:1"}.相反,它应该查找 ID,显示名称,然后执行 find_or_create_by,这样它就不会创建新的 Tag.

I have the following Tag: {"id":1,"name":"Food"}. When I save a Product, tagged "Food", it should save as ID: 1 when it searches and finds the name "Food". Currently, it saves a new Tag with a new ID that references the "Food" ID, i.e. {"id":19,"name":"1"}. Instead, it should be finding the ID, showing the name, and doing a find_or_create_by so it doesn't create a new Tag.

当我通过执行 <%= @product.tag_list %>products/show 查看标签时.该名称显示为标签:1",而实际上应该是标签:食物".

When I go to products/show to see the tags by doing <%= @product.tag_list %>. The name appears as "Tags: 1", when it really should be "Tags: Food".

我该如何解决这些问题?

How can I fix these issues?

推荐答案

你应该在你的 routes.rb 中定义一个路由来处理 products/tags 路径.你可以这样定义:

You should define a route in your routes.rb which should handle products/tags path. You can define it like:

get "products/tags" => "products#tags", :as => :tags

因此应该给你一个 tags_path 助手,它应该评估为 /products/tags.这应该可以消除您在问题中提到的错误.在你的 routes.rb

Thus should give you a tags_path helper which should evaluate to /products/tags. This should get rid of the errors you mentioned in the question. Be sure to add this route before defining resources :product in your routes.rb

现在到 acts-as-taggable-on,我还没有使用了这个 gem,但你应该看看方法 all_tag_counts 文档.您的 ProductsController#tags 方法需要对以下几行进行一些更改.我不确定它是否确切需要什么,因为我使用 Mongoid 并且无法对其进行测试.

Now onto acts-as-taggable-on, I haven't used this gem, but you should look at method all_tag_counts documentation. Your ProductsController#tags method will need some changes on the following lines. I am not sure if its exactly what would be required, as I use Mongoid and can't test it out.

def tags
  @tags = Product.all_tag_counts.(:conditions => ["#{ActsAsTaggableOn::Tag.table_name}.name LIKE ?", "%#{params[:q]}%"])
  respond_to do |format|
    format.json { render :json => @tags.collect{|t| {:id => t.name, :name => t.name } }
  end  
end

这篇关于如何使用 jquery-Tokeninput 和 Acts-as-taggable-on的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆