0

我有一个嵌套表单,通过添加更多按钮加载,在嵌套表单中我有单选按钮。根据单选按钮,调用一个javascript函数来隐藏或显示一个div。但是对于两个或更多表单,单选按钮 javascript 调用第一个 div,因为 div id 是静态的。请帮忙。这里是代码。

form.html.erb

 <%= f.fields_for :book_chapters  do |book| %>
 <%= render '/publications/book_chapter', :ff => book %>
 <% end %>
 <%= f.link_to_add "Add chapter", :book_chapters, :class => "add_category_link"%>

_book_chapter.html.erb

<%= ff.input :chapter_no %>
<%= ff.input :chapter_title %>
<%= ff.input :description %>
<%= ff.input :pdf, :hint => "Please upload Pdf's Only." %>     
<div class="control-group string optional">
  <label class="string optional control-label">Plan</label>
<div class="controls">
<%= ff.radio_button :plan, "free", :class=>"relat__atu relat__atu_no" %> Free
<%= ff.radio_button :plan, "premium", :class=>"relat__atu relat__atu_yes" %>Premium

<script>
  jQuery(".relat__atu").on("change", function(){
    jQuery("#esatu").toggle($(this).hasClass("relat__atu_yes"));
  })
</script>

<div id="esatu" style="display:none">
  <label for="relat_tipus_atu">
    <%= ff.input :credits %>
  </label>
</div>

<div class="controls">
  <%= ff.link_to_remove "remove", :class => "remove_category" %>
</div>
4

2 回答 2

0

您可以在 div 中渲染部分内容,例如

<div class='some_div'>
  <%= render '/publications/book_chapter', :ff => book %>
</div>

将您的 div 的 id 更改为 class

<div class="esatu" style="display:none">

并将js更改为

jQuery(".some_div").on("change", ".relat__atu", function() {
  jQuery(".esatu", $(this).parent('.some_div')).toggle($(this).hasClass("relat__atu_yes"));
})
于 2013-05-30T11:19:53.757 回答
0

我设法通过查看嵌套形式 gem 解决了这个问题。为每个添加动态生成嵌套的 gem 内部唯一 ID。解析数据蓝图,并用生成的唯一 ID 替换“new_#{association}”。在我的情况下,关系就像“publication”has_many“book_chapters”,所以我的关联是 book_chapters。我用 id = "book_chapters" 分配了新行,并在添加新行时将其替换为唯一 ID。

也许它对其他人有用

于 2013-05-31T04:47:03.277 回答