Rails AJAX Неполный рендеринг

Question

У меня есть форма для создания нового source на sources#create, на котором есть модал для создания нового author. Пользователь может либо создать новый author для назначения источнику, либо выбрать существующий из контрольного списка.

В идеале, если им действительно нужно создать нового автора, форма authors#create создаст автора AJAX, то есть новый автор автоматически появится в контрольном списке авторов, который может быть связан с source.

Вот код для флажков выбора автора на sources#create:

  <section id="author" class="white h-100">

    <h2>Author(s)</h2>

    <% if @user_authors.count != 0 %>
      <p class="text-center">Select an author to add below or <a data-toggle="modal" data-target="#newAuthorModal">create a new author</a>.</p>
      <div id="#authorsChecklist"><%= render partial: "authors/checklist", locals: { f: f } %></div>
    <% else %>
      <p class="text-center"><a data-toggle="modal" data-target="#newAuthorModal">Create a New Author</a></p>
    <% end %>

  </section>

С этим как authors/_checklist.html.erb частичное:

<div class="boxed-scroll">
  <%= f.collection_check_boxes :author_ids, @user_authors.sort_by(&:last_name), :id, :last_first do |b| %>
    <div class="field form-check" style="display: block">
      <%= b.check_box class: "form-check-input" %>
      <%= b.label class: "form-check-label" %>
    </div>
  <% end %>
</div> <!-- boxedscroll -->

И это как модальный для создания автора:

<!-- New Author Modal -->
<div class="modal fade" id="newAuthorModal" tabindex="-1" role="dialog" aria-labelledby="newAuthorModalLabel"
  aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="newAuthorModalLabel">Add a New Author</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <%= render partial: "authors/js_form", locals: {author: @new_author} %>
      </div>
    </div>
  </div>
</div>

А вот метод create:

  def create
    @author = Author.new(author_params)
    @author.user_id = current_user.id

    respond_to do |format|
      if @author.save
        format.html { redirect_back(fallback_location: author_path(@author)) }
        format.json { render :show, status: :created, location: @author }
        format.js
      else
        format.html { render :new }
        format.json { render json: @author.errors, status: :unprocessable_entity }
      end
    end
  end

А вот authors/create.js:

  $("#authorsChecklist").html("<%= escape_javascript(render partial: 'authors/checklist', locals: { f: f } ) %>"); 

Пока что автор действительно создается успешно:

Started POST "/authors" for ::1 at 2020-01-31 21:23:26 -0800
Processing by AuthorsController#create as JS
  Parameters: {"utf8"=>"✓", "author"=>{"first_name"=>"Liz", "middle_initials"=>"", "last_name"=>"Bayardelle", "notes"=>""}, "commit"=>"Save Author Info"}
  User Load (1.0ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT $2  [["id", 1], ["LIMIT", 1]]
  ↳ app/controllers/application_controller.rb:5
   (0.1ms)  BEGIN
  ↳ app/controllers/authors_controller.rb:32
  User Load (0.3ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 1], ["LIMIT", 1]]
  ↳ app/controllers/authors_controller.rb:32
  Author Create (0.8ms)  INSERT INTO "authors" ("first_name", "middle_initials", "last_name", "notes", "user_id", "created_at", "updated_at") VALUES ($1, $2, $3, $4, $5, $6, $7) RETURNING "id"  [["first_name", "Liz"], ["middle_initials", ""], ["last_name", "Bayardelle"], ["notes", ""], ["user_id", 1], ["created_at", "2020-02-01 05:23:26.279449"], ["updated_at", "2020-02-01 05:23:26.279449"]]
  ↳ app/controllers/authors_controller.rb:32
   (0.4ms)  COMMIT
  ↳ app/controllers/authors_controller.rb:32
  Rendering authors/create.js
  Rendered authors/create.js (0.4ms)
Completed 200 OK in 214ms (Views: 27.8ms | ActiveRecord: 42.7ms)

Однако, модал не исчезает go, когда вы нажимаете "Отправить", и автор не добавляется в список флажков (в основном это не refre sh). Когда вы вручную нажимаете refre sh, автор выглядит отлично.

Может кто-нибудь увидеть, как правильно получить это значение до AJAX? Требуемое поведение - модальное исчезновение при нажатии кнопки «Отправить» и контрольный список, частично относящийся к AJAX, то есть к рефракции sh, поэтому появляется автор.

ОБНОВЛЕНИЕ

Согласно комментариям, я добавил это к create.js, что успешно делает модальное исчезновение, хотя частичное не refre sh:

$('#newAuthorModal').modal('hide');

Затем я нашел этот вопрос , который показал, что мне нужно изменить create.js на create.js.erb. Это каким-то образом остановило модальное исчезновение, но привело к ошибке сервера:

NameError - undefined local variable or method `f' for #<#<Class:0x00007f9e1e0c0ad0>:0x00007f9e18101d38>:
  app/views/authors/create.js.erb:2:in `_app_views_authors_create_js_erb__3387754959944580247_70158492637620'

ВТОРОЕ ОБНОВЛЕНИЕ

После ознакомления с документацией для collection_check_boxes, f. до collection_check_boxes не нужно. Я удалил его и удалил , locals: { f: f } из моего create.js.erb. Модал теперь корректно закрывается и ошибка исчезла, но мне все равно нужно нажать refre sh, чтобы имя появилось.

Answer 1

В sources#create произошла опечатка:

<div id="#authorsChecklist">

Должно было быть:

<div id="authorsChecklist">

И метод контроллера должен был включать определение @user_authors:

format.js do
   @user_authors = Author.where(user_id: current_user.id)
end

Теперь это работает!