如何在 Stack Overflow 或 Quora 上创建标签系统

Question

我想创建一个标签系统，就像在 Stack Overflow 或 Quora 上看到的那样。它将是它自己的模型，我计划使用this autocomplete plugin 来帮助用户找到标签。我有几个问题：

1. 我希望标签完全由用户生成。如果用户通过键入新标签并按下“添加”按钮输入新标签，则该标签将添加到数据库中，但如果用户输入现有标签，则使用该标签。我正在考虑使用这样的代码：

   def create
   
   @video.tags = find_or_create_by_name(@video.tags.name)
   
   end
   

   我走对了吗？

2. 我想在 Stack Overflow 或 Quora 上实现类似的功能，这样当您单击建议列表中的标签或单击“添加”按钮时，该标签会被添加到带有 ajax 的文本字段的正上方。我将如何实施这样的事情？

我知道这是一个开放式问题。我并不是在寻找确切的代码，而是在寻找正确的方向。当然，代码示例也无妨:)

请注意，我并不是在寻求有关如何设置 jQuery 自动完成插件的帮助...我知道该怎么做。相反，似乎我必须修改插件中的代码，以便将标签添加到文本字段上方，而不是添加到文本字段中。我将不胜感激。

Answer 1

我越是尝试force acts-as-taggable-on gem 工作，我就越认为这些是根本不同类型的问题。特别是因为别名。 gem 认为每个标签都是它自己的特殊雪花，因此很难创建同义词。在某些情况下，它还远远不够，如果您希望标签有描述，您需要编辑给定的迁移（这并不难）。

这是我正在考虑实施的，given the trouble I've had implementing via the gem。假设您要为技术创建一个标记系统。

考虑下面的伪代码，我还没有测试过。

rails g model Tech usage_count::integer description:text icon_url:string 等。运行迁移。注意

现在在控制器中，您需要在每次发生某些事情时增加 usage_count，用户提交一个带有给定文本标记的新问题。

rails g model Name::Tech belongs_to:Tech name:string

Name::Tech model
  belongs_to :tech
end

然后您可以通过以下方式进行搜索：

search = Name::Tech.where("name LIKE :prefix", prefix: "word_start%")
.joins(:tech)
.order(usage_count: desc)
.limit(5) 

这是起点。它与 gem 根本不同，因为每个标签本身只是一个字符串，但在后端引用了更丰富的数据表。我将努力实施并回来更新一个更好的解决方案。

Answer 2

mbleigh's acts_as_taggable_on gem 是一个功能齐全的解决方案，您绝对应该仔细研究一下。该实现坚如磐石且使用灵活。但是，它主要关注将标签附加到对象、检索对象上的标签以及搜索已标记的项目。这都是后端服务器的东西。

您希望更改的大多数功能（基于您的 cmets）实际上更多地与您的前端 UI 实现相关，而 gem 在那里并没有真正为您做太多事情。我会一一处理您的请求。

1. 如果用户输入一个新标签，该标签 被添加，如果用户输入 现有标签，现有标签获取 用过的。 act_as_taggable_on 就是这样做的。
2. 单击建议列表中的标签以 添加该标签。这是一 实施问题——关于 后端你需要收集 建议的标签列表，然后显示 演示文稿中的链接 到您的处理功能。
3. 在用户输入时自动完成 潜在标签。您将使用 jQuery 针对列表的自动完成插件 从标签表上取下的物品。 使用额外的 jQuery，您可以 当他们选择其中之一时捕获 选项，或完成输入 他们的新标签，然后调用 处理函数。
4. 限制用户只能输入一个 标签。这将是您的用户界面 实施——一旦他们已经 输入或选择标签，您 处理它。如果他们输入两个字 用逗号分隔，然后在或之前 在处理过程中，您必须 把它当作一个标签，或者只取 直到第一个逗号的文本和 丢弃其余的。
5. 当您处理添加 标签，你将不得不做两件事。 首先，您需要处理 UI 显示更改以反映 标签已被输入/选择。这 包括将标签放置在 “选定”区域，将其从 “可用”显示，更新任何 计数器等。其次，你需要 向服务器发送请求 实际上将标签添加到对象 并坚持这一事实 数据库（可标记的 gem 将为您接管）。您可以通过以下方式执行此操作 每个标签一个单独的 AJAX 请求， 或者你可以在提交的时候处理 表格。如果是后者，您将需要 一个变量来保持运行列表 已添加/删除的标签 你需要代码来处理 向该变量添加/删除值。

有关在编辑时保存标签但在保存表单之前不发送到服务器/数据库的示例，您可以查看 Tumblr 新帖子页面上的标签功能。您可以在创建帖子时随意添加/删除标签，但在您点击保存之前不会进入数据库。

如您所见，其中大部分内容由您自己确定和编码，但与后端部分关系不大。宝石会很好地为您解决这个问题。

我希望这有助于您朝着正确的方向前进。