Rails Turbo 似乎无法正常工作

Question

我想实现什么目标：

• 将 json 粘贴到表单中；
• 提交表格
• 提交后，我不想重新加载整页，但我只想使用表单提交的响应更新一个 div。 div 位于表单下方

dashboard_controller.rb

  def append_data
    data = params[:data]

    @response = ApiDataService.append_data(data)["data"]

    if @response.present?
      flash[:success] = "Data appended successfully"
      respond_to do |format|
        format.turbo_stream do
          render turbo_stream: turbo_stream.replace(
            "response", partial: "dashboard/response", locals: { response: @response }
          )
        end
      end
    else
      flash[:error] = "Failed to append data"
      redirect_to root_path
    end
  end

index.html.erb

<%= form_with url: dashboard_append_data_path(format: :turbo_stream) do |form| %>
  <div class="form-group">
    <label for="data">Paste JSON data here:</label>
    <%= form.text_area :data, class: 'form-control', required: true, id: 'data', rows: 10 %>
  </div>

  <div class="row justify-content-center my-3 px-3">
    <%= form.submit "Submit Data", class: 'btn btn-primary btn-block my-2' %>
  </div>
<% end %>

<%= turbo_frame_tag :response do %>
  text to be replaced
<% end %>

路线.rb

post 'dashboard/append_data', to: 'dashboard#append_data'

_response.html.erb

<div id="response">
  <p><%= response %></p>
</div>

生成的 html 如下所示：

<form action="/dashboard/append_data.turbo_stream" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="" autocomplete="off">
 <div class="form-group">
  <label for="data">Paste JSON data here:</label>
  <textarea class="form-control" required="required" id="data" rows="10" name="data"></textarea>
 </div>

 <div class="row justify-content-center my-3 px-3">
  <input type="submit" name="commit" value="Submit Data" class="btn btn-primary btn-block my-2" data-disable-with="Submit Data">
 </div>
</form>
<turbo-frame id="response">
  text to be replaced
</turbo-frame>

使用提交后的当前设置，我将被重定向到此路径：

/dashboard/append_data.turbo_stream

并且应该使用 id=response 更新 Turbo 框架的内容将作为新页面打开，并带有提到的路径，甚至不会渲染，以纯文本形式显示。

如果我从index.html.erb中删除格式：:turbo_stream参数：

<%= form_with url: dashboard_append_data_path do |form| %>

这会导致错误，未知格式：

任何人都知道发生了什么，为什么我不能使表单仅更新该 div？ 另一种方法是使用 AJAX 请求，但涡轮流应该是更 Rails 的方法。 应该很容易实现这一点，因为并不复杂。

Answer 1

我不知道这是否是由于 Javascript 造成的，但在我的情况下，浏览器似乎是问题所在。 我在 Firefox 上测试它，切换到 Chrome 解决了问题，现在它就像一个魅力。