我有一个rails表单,可以使用自定义控制器一次创建多达25个新对象(此应用程序中的文章)。我写了一些简单的jquery隐藏表单2-25,直到用户点击“Add More Essays”按钮,显示其余的表单。刷新页面后提交/持久性工作正常 - 即使我之前遇到过这个错误 - 我很确定这是一个HTML问题。 HTML不是我的力量,我找不到问题的根源。我知道根据this帖子一起使用时,表格/表格可能会有问题。任何指导都会很棒。
HTML:
<!-- essay form -->
<%= form_tag essays_path, multipart: true do |form| %>
<% @essays.each do |essay| %>
<% if essay.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@essay.errors.count, "error") %> prohibited this essay from being saved:</h2>
<ul>
<% @essay.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %> <!-- closes @essay.errors... loop -->
<% end %> <!-- closes essay.errors... loop -->
</ul>
</div>
<% end %> <!-- closes @essays.each... loop -->
<% @essays.each do |essay| %>
<%= fields_for 'essays[]', essay do |f| %>
<div class="field list-group-item essay-upload">
<div class="actions col-md-6 col-md-offset-3">
<%= submit_tag 'Upload Essay(s)', :class => 'upload-individual-essay btn btn-lg btn-primary btn-block upload-new-essays'%>
</div>
<table class="table">
<thead>
<tr>
<% if current_user.admin? %>
<th>Company</th>
<% end %>
<th>Student First Name</th>
<th>Student Last Name</th>
<th>Package</th>
<th>Document</th>
<th></th>
</tr>
</thead>
<tbody>
<tr class="essays-new-table-row">
<% if current_user.admin? %>
<td>
<div class="field list-group-item">
<div>
<%= f.select :company_id, options_for_select(@companies) %>
</div>
</div>
</td>
<% end %> <!-- closes current_user.admin? -->
<td>
<%= f.text_field :student_first_name, class: 'form-control', placeholder: 'First Name' %>
</td>
<td>
<%= f.text_field :student_last_name, class: 'form-control', placeholder: 'Last Name' %>
</td>
<td>
<div class="list-group-item">
<%= f.select :package_id, options_for_select(@packages) %>
</div>
</td>
<td>
<%= f.file_field :document, class: "essays__document" %>
</td>
</tr>
</tbody>
</table>
<button type="button" class="btn btn-lg btn-success btn-block add-another-essay"> Add More Essays</button><br>
</div> <!-- <div class="field list-group-item essay-upload"> -->
<% end %> <!-- closes field_for -->
<% end %> <!-- closes second @essays.each ... -->
<% end %> <!-- closes closes form -->
JS:
var ready;
ready = function() {
// FUNCTIONALITY: hide extra divs
$(".essay-upload").hide();
$(".essay-upload:first").show();
// FUNCTIONALITY: reveal other forms on 'add more essays' click
$('.add-another-essay').on('click', function(){
$(".essay-upload").show();
$('.add-another-essay').remove();
$('.upload-individual-essay').hide();
$('.upload-individual-essay:first').show();
})
$(document).on('page:change', ready);
答案 0 :(得分:1)
根据我所看到的,你总是只显示一个(第一个)submit_tag
,但你有25个!在页面上提交标签...
您如何考虑将此submit_tag
移到循环之外? (@ essays.each)。那里不需要它(它提交最高形式)。在这种情况下,您可以避免隐藏&amp;显示提交标签
$('.upload-individual-essay').hide();
$('.upload-individual-essay:first').show();
提交标记的位置可以通过CSS样式设置
对于我的观点,理解它会更清晰。