У меня проблема при попытке использовать поля загрузки вложенных файлов коконов в форме. Форма отправляется через AJAX, а затем повторно отображается с частичным обновлением update.js.erb.
Вот моя часть с ответом и форма редактирования:
li id="answer_#{answer.id}" class=('accepted' if answer.accepted?)
div.answer-body
span
= answer.body
ul
- answer.attachments.each do |a|
li= link_to a.file.identifier, a.file.url
- if user_signed_in? && current_user.id == answer.user_id
= link_to 'Delete answer', [@question, answer], remote: true, method: :delete
= link_to 'Edit answer', {}, class: "edit-answer", href: '#'
- if user_signed_in? && current_user.id == @question.user_id && !answer.accepted?
= link_to 'Accept answer', accept_question_answer_url(@question, answer),
remote: true, method: :patch, class: 'accept-answer', href: '#'
div.edit-answer-form.conceal
= form_for [@question, answer], remote: true do |f|
= f.label :body, 'Edit answer'
= f.text_area :body
div.form-group
= f.fields_for :attachments do |field|
= render 'attachment_fields', f: field
.links
= link_to_add_association "Moar files!", f, :attachments
= f.submit 'Save', class: 'submit'
= f.button 'Discard', class: 'discard', type: 'button'
После успешной отправки он полностью перерисовывается.
Вот часть "application/_attachment_fields"
:
.nested-fields
.field
= f.label :file
= f.file_field :file
= link_to_remove_association "Remove this attachment", f
Cocoon использует атрибут в элементе link_to_add
с планом для нового поля. Когда я отправляю эту форму без добавления новых файлов, все кажется прекрасным. Ссылка выглядит так:
<a class="add_fields" data-association="attachment" data-associations="attachments" data-association-insertion-template="<div class="nested-fields">
<div class="field">
<label for="answer_attachments_attributes_new_attachments_file">File</label><input type="file" name="answer[attachments_attributes][new_attachments][file]" id="answer_attachments_attributes_new_attachments_file" />
</div>
<input type="hidden" name="answer[attachments_attributes][new_attachments][_destroy]" id="answer_attachments_attributes_new_attachments__destroy" value="false" /><a class="remove_fields dynamic" href="#">Remove this attachment</a>
</div>" href="#">Moar files!</a>
Проблема проявляется, когда я добавляю новый файл в форму и отправляю его. Цитаты в чертеже не экранируются, и я получаю эту ссылку:
<a class="add_fields" data-association="attachment" data-associations="attachments" data-association-insertion-template="<div class="nested-fields">
<div class="field">
<label for="answer_attachments_attributes_new_attachments_file">File</label><input type="file" name="answer[attachments_attributes][new_attachments][file]" id="answer_attachments_attributes_new_attachments_file" />
</div>
<input type="hidden" name="answer[attachments_attributes][new_attachments][_destroy]" id="answer_attachments_attributes_new_attachments__destroy" value="false" /><a class="remove_fields dynamic" href="#">Remove this attachment</a>
</div>" href="#">Moar files!</a>
Он портит всю форму и выталкивает из нее кнопки отправки и отмены, что делает невозможным отправку.
Мой update.js.erb
, который отображается при каждой отправке формы:
var answer_item = $('#<%= dom_id(@answer) %>');
<% if @answer.errors.any? %>
answer_item.find('.edit-answer-form').prepend("<%= j render 'shared/error_messages', object: @answer %>");
<% else %>
answer_item.replaceWith('<%= j(render @answer) %>');
<% end %>
Я уверен, что это не проблема кокона, так как раньше я использовал гем nested_form, и у него была аналогичная проблема с той же концепцией, там это называется blueprint.
Я попытался выполнить предыдущий вызов j
методом raw
, но проблема не устранена.
Я в замешательстве, ребята.