将元素的id传递给Rails hidden_​​field形式的帮助器

Question

我正在开发一个Rails应用程序，我希望捕获一条信息并在用户保存表单时提交它（在现实生活中发表评论）。

这似乎非常适合我所读过的hidden_field助手。然而，＆＃34;隐藏信息＆＃34;我需要包含的不是像页面上某处的文本输入那么简单的东西。

我要问的是什么：在我看来，博客帖子是使用Markdown宝石呈现的。每个标题标记在DOM中都有一个唯一的ID，您不会在下面看到（即<h1 id="toc_0">，<h3 id="toc_1">。

用户点击标题，它会在右侧打开一个评论框。保存该评论框后，我希望它将此id保存为名为:location的现有列中的字符串。

我在表单中添加了hidden_field行;然而，它并没有捕获任何东西。是否可以捕获此单击元素的ID，以便将其保存到我的表中？

视图

<div class="col-sm-8">
    <% @posts.each do |post| %>
            <h2 id="title"><%= post.title %></h2>
            <p id="category"><%= post.category %></p>
            <div id="paragraph"><%= markdown(post.content) %></div>    
    <% end %>
</div> 

  <!-- jQuery hides this and it toggles next to the clicked paragraph -->
    <div class="exampleToggle">
        <%= form_for :comments do |f| %>
            <div class="form-group">
                <div class="field">
                    <%= f.label :post %><br>
                    <%= f.text_area :post, class: "form-control" %>
                </div>
            </div>

            <h5 id="username">Username</h5>
            <div class="form-group">
                <div class="field">
                    <%= f.text_field :username, class: "form-control" %>
                </div>
            </div>

            <%= f.hidden_field :location, :id => "hiddenPicker"%>

    <div class="actions">
        <%= f.submit "Save", class: "btn btn-success-outline" %>
    </div>
<% end %>
</div>

  <script>

    $(document).ready(function(){
        $('.exampleToggle').hide();
        var whatever = document.getElementsByClassName("exampleToggle");
        $("h3").click(function(){
             $('.exampleToggle').show();
             $(this).prepend(whatever);
              $("form:not(.filter) :input:visible:enabled:first").focus();
            });
        });

</script>

Answer 1

点击后，您可以使用 jQuery 获取H3的ID，并将其传递给隐藏字段：

$(function () {
  $('h3').on('click', function () {
    var id = $(this).attr('id');
    $('input#hiddenPicker').val(id);
  });
});