使用jQuery的tokeninput和acts_as_taggable_on

我已經實現了本文中概述的框架：How to use jquery-Tokeninput and Acts-as-taggable-on有一些困難。只要預先填充了適當的主題和ajax搜索，就可以工作，但是當我輸入一個新標籤時，當文本區域失去焦點時它會立即被刪除。我不確定我做錯了什麼。下面是我的一些相關的代碼：使用jQuery的tokeninput和acts_as_taggable_on

用戶模型（做了標記）：

class User < ActiveRecord::Base 
[...] 
# tagging 
acts_as_tagger

產品型號（接受標籤）：

class Item < ActiveRecord::Base 
attr_accessible :title, :tag_list 

#tagging functionality 
acts_as_taggable_on :tags

項目控制器：

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

在我的表格部分：

<%= f.input :tag_list, :label => "Tags", :input_html => { :class => "text_field short", "data-pre" => @item.tags.map(&:attributes).to_json }, :hint => "separate tags by a space" %>

條

我的路線：

get "items/tags" => "items#tags", :as => :tags 
resources :items

[幾乎沒有!!!]

窗體上的JS [注：該元素的ID分配動態]：

<script type="text/javascript"> 
$(function() { 
    $("#item_tag_list").tokenInput("/art_items/tags", { 
    prePopulate:  $("#item_tag_list").data("pre"), 
    preventDuplicates: true, 
    crossDomain: false, 
    theme: "facebook" 
    }); 
}); 
</script>

來源

2011-11-21 panzhuli

當您的意思是「輸入一個新的標籤，它會立即刪除文本區域失去焦點時」，您的意思是從下拉菜單中選擇正確的標籤後？或者你的意思是，當你只是想在該領域內創建一個全新的標籤時，它會消失嗎？ – LearningRoR

所以這個字段是一個文本輸入字段。當用戶輸入時，它會自動填充現有條目。我希望它添加一個條目到「標籤」列表中，如果它沒有找到，但這個插件不會這樣做。我正在研究其他UX選項。感謝您入住！ – panzhuli

Np，我給了我兩分錢，以防萬一您決定在將來回到TokenInput。 – LearningRoR

如果你仍然想使用Jquery TokenInput並添加標籤，有不同的方法來做到這一點。

1. 這實際上來自我的同一個問題;最新的回答：How to use jquery-Tokeninput and Acts-as-taggable-on

這可能會在你的控制器。

def tags 
    query = params[:q] 
    if query[-1,1] == " " 
     query = query.gsub(" ", "") 
     Tag.find_or_create_by_name(query) 
    end 

    #Do the search in memory for better performance 

    @tags = ActsAsTaggableOn::Tag.all 
    @tags = @tags.select { |v| v.name =~ /#{query}/i } 
    respond_to do |format| 
     format.json{ render :json => @tags.map(&:attributes) } 
    end 
    end 

This will create the tag, whenever the space bar is hit. 

You could then add this search setting in the jquery script: 

noResultsText: 'No result, hit space to create a new tag', 

It's a little dirty but it works for me.

2. 退房這傢伙的方法：https://github.com/vdepizzol/jquery-tokeninput

他做了一個自定義項能力：

$(function() { 
    $("#book_author_tokens").tokenInput("/authors.json", { 
    crossDomain: false, 
    prePopulate: $("#book_author_tokens").data("pre"), 
    theme: "facebook", 
    allowCustomEntry: true 
    }); 
});

3. 不要知道這一個但它可能有所幫助：Rails : Using jquery tokeninput (railscast #258) to create new entries

4. 這一次似乎合法，以及：https://github.com/loopj/jquery-tokeninput/pull/219

我個人比較喜歡第一個，似乎最容易獲取和安裝。

來源

2011-12-09 02:22:24 LearningRoR

使用jQuery的tokeninput和acts_as_taggable_on

回答

相關問題