基于我在rails中的标签文本数据库列动态添加按钮

Question

我有一个 Rails 应用程序，我想在数据库中根据我的标签文本动态添加按钮。我有一个问卷模式，它包含带有各种标签的标签列，即PERSONAL STYLE,STYLING ,WARDROBE.我的 UI 应该自动为每个标签列值添加按钮，即如果它在标签列中包含 3 个标签，那么它应该动态添加 3 个按钮，上面写有 PERSONAL STYLE、STYLING、WARDROBE。在点击这些按钮时，这些标签特定的问题必须显示在 UI 中。

这是用户界面的图像 User Interface(UI) for above

我的架构是这样的，有 3 列。具有这些模式的问卷表的问卷模型
id , label , question

当我点击STYLING 按钮时，来自数据库的STYLING 标记问​​题应显示在 UI 中。
如何实现。 目前我可以从数据库中加载所有问题。但是我现在必须在点击标签按钮时在 UI 上显示标签特定的问题。

这里是我的 html.erb 代码

<% @questionnaire.each do |question| %>
<label> <%= question.label %></label>
<h2> <%= question.text %></h2>
<% end %>

控制器中的代码

 @questionnaire = Questionnaire.all

每一个建议都将不胜感激。

Answer 1

这可能有语法错误，但我认为这个想法很清楚。

为每个问题添加两个类。 “标签”和具体标签：

<% @questionnaire.each do |question| %>
  <div class="labels <%= question.label %>">
    <label> <%= question.label %></label>
    <h2> <%= question.text %></h2>
  </div>
<% end %>

为每个不同的标签添加一个链接。您应该在页面右侧显示这些链接（本示例中不包含这些链接）。

<% @questionnaire.uniq { |question| question.label }.each do |question|
  <%= link_to question.label, '#', class: "set-label" %>
<% end %>

添加一个脚本来处理对这些链接的点击：

<script>
  $(".set-label").on("click", function () {
    lab = $(this).text()     // get the label that was clicked
    $(".labels").hide()      // hide all questions
    $(".labels."+lab).show() // show questions with this label
  }); 
</script>