將元素的ID傳遞給Rails hidden_​​field表單助手

Question

我正在使用Rails應用程序，並且我想捕獲一條信息並在用戶保存表單時提交它（在現實生活中發表評論） 。

這看起來很適合hidden_field助手從我讀過的東西。然而，我需要包含的「隱藏信息」並不像在頁面上的文本輸入那樣簡單。

我在問什麼：在我看來，博客文章是使用Markdown gem呈現的。每個標題標籤在DOM中都有一個唯一的ID，您不會在下面看到（例如，<h1 id="toc_0">,<h3 id="toc_1">,

用戶單擊標題並打開右側的評論框。得救了，我希望它給這個ID保存爲名爲:location現有列中輸入字符串

我已經加入我的形式hidden_field線;然而，沒有捕捉到任何事情都是有可能捕捉到的這個ID。點擊元素，以便我可以將它保存到我的桌子上？

The View

<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); 
    }); 
});