Ясность в форматах ответов и перезагрузке страницы для ответа html в Rails

Question

Я хотел бы понять ответ format действий в Rails. Предположим, у меня есть link_to в моем фрагменте, который отображается на странице show, как показано ниже:

show. html .erb

<%= render partial: 'my_partial', locals: { stage: @stage } %>

my_partial. html .erb

<% case 'stage' %>
<% when 'beginning' %>
  <%= link_to 'Submit', { controller: 'my_controller', action: 'update_model' } %>
<% when 'ongoing' %>
  <%= render partial: 'another_partial' %>
<% end %>

my_controller.rb

def update_model
  #do something
  respond_to do |format|
    format.json { render json: { some_key: some_value } }
    format.js { render partial: 'path_to_partial/partial.js' }
    format.html { redirect_to action: 'show' }
  end
end

Здесь при загрузке страницы show для первой время @stage будет beginning, а затем при нажатии link_to 'Submit' затем перед ответом от контроллера значение @stage будет изменено на ongoing.

Теперь. Когда я нажимаю link_to, страница перезагружается, и response находится в html, поэтому format.html отправляется. Если я добавлю remote: true, то ответ будет js, и страница не перезагрузится, потому что это remote.

Итак, точная функциональность, которую я хочу, это перерисовать страницу show, а затем внутри my_partial она должна go до when ongoing, а затем визуализировать страницу another_partial без перезагрузки. Это происходит в том же URL-адресе.

Я пытаюсь понять, почему страница перезагружается, когда это тот же URL-адрес? Так работает format.html? Что я должен сделать, чтобы снова отобразить страницу show, но без перезагрузки страницы?

Answer 1

Как выглядит respond_to do |format|, какой ответ ожидает входящий http-запрос. Обычно, если вы нажимаете на ссылку или отправляете форму, она ожидает html. Но, как вы правильно сказали, если вы добавите remote: true http-запрос, отправленный по ссылке, ожидает javascript. Теперь вы хотите перерисовать только часть, а не всю страницу. Вы можете сделать это так в контроллере

def update_model
 ...
  respond_to do |format|
    ...
    format.js 
    ...
  end
end

Не назначать блок для format.js, это автоматически отобразит файл в представлениях, который - как всегда - должен быть назван как действие контроллера. Итак, update_model.js.erb И здесь вы можете решить, что делать. Так, например, найдите div, который содержит вашу частичную часть, и затем измените ее. Благодаря .erb вы также можете написать встроенный ruby код в этот js файл. И именно здесь вы решаете, какую часть перерисовать или что делать (переключать классы, ...)

const container = document.querySelector("#container-for-partial")
const partial = "<%= j render 'some_partial' %>"
// Inject HTML to partial
container.innerHTML = partial