使用 Turbolinks 渲染同一页面时无法使用 Flash

我试图在点击更新端点后显示闪存消息。我想让用户保持在同一页面上并告诉他信息已更新。我启用了 Turbolink。

我的操作如下：

def update
    @form = Form.find(params[:id])

    if @form.update(form_params)
      respond_to do |format|
        flash.now[:notice] = "Form updated successfully"
        format.html  { render 'edit' }
        format.js { render 'edit' }
        # format.html  { redirect_to edit_form_path(@form), notice: "Form updated successfully" }
        format.json { render json: {message: "Form updated successfully", form: @form} }
      end
    else
      respond_to do |format|
        format.html { render 'new'}
        format.json { render json: {errors: @form.errors}, status: :unprocessable_entity }
      end    
    end
  end

我都尝试过flash and flash.now两者都没有结果。如果您看到被注释掉的行，它将重定向到同一页面并渲染 Flash。

这是我打印闪存的方法：

<%= notice %>
<%= flash.notice %>

我都用过，但似乎都不起作用。

根据我的观察，我可以看到 Turbolinks 击中了format.js端点。谁能帮我这个？

Edit

这就是我的表格的样子：

<%= form_with(model: @form, method: 'put') do |f| %>
  <!-- name -->
  <div class="field">
    <label class="label">
      From Name
      <sup class="is-danger">*</sup>
    </label>
    <p class="control">
      <%= f.text_field :name, class: "input" %>
    </p>
    <% if @form.errors.any? %>
    <p class="help is-danger">
      Form name <%= @form.errors[:name].first %>
    </p>
    <% end %>
  </div>

  <!-- create button -->
  <div class="control">
    <%= f.submit class: "button is-primary" %>
  </div>
<% end %>

Ajax 与 Rails 形成

警告：我正在使用手机，无法对此进行测试。但这无论如何都应该有效。

要表示您想通过 Ajax 提交表单，您需要输入remote: true在您的表单元素上，如下所示：

<%= form_with model: @form, method: 'put', remote: true do |f| %>
 <!-- rest of the form -->
<% end %>

当您单击“提交”时，您会注意到页面没有更改，但 Rails 日志仍然显示您对控制器执行了 ping 操作。整洁的！

接下来，您需要弄清楚如何处理这些数据。就是这样respond_to is for.

respond_to将根据控制器的访问方式发送不同的响应。就你而言，重要的是format.js，但您总是希望为 HTML 提供后备。

def update
    @form = Form.find(params[:id])

    if @form.update form_params
      respond_to do |format|
        flash.now[:notice] = "Form updated successfully"
        format.html  { redirect_to <SHOW PATH> }
        format.js # Will automatically look for update.js.erb
        format.json { render json: {message: "Form updated successfully", form: @form} }
      end
    else
      respond_to do |format|
        format.html { render :edit }
        format.json { render json: {errors: @form.errors}, status: :unprocessable_entity }
      end    
    end
  end
end

请注意，我做了一些代码更改。

现在，当您提交表单时，您应该看到没有任何变化，控制器被击中，记录被处理，然后Rails将查找update.js.erb。这就是我们下一步需要去的地方！

创建该文件后，填写：

console.log("<%= notice %>");

此时，验证您提交后是否可以在控制台中看到闪烁。

您需要将显示 Flash 消息的 HTML 抽象为我要调用的部分_notifications.html.erb它将包含以下内容：

<!-- _notifications.html.erb -->

<div id="flash">
  <% if notice.present? %>
    <%= notice %>
  <% end %>
</div>

最后，您必须更换闪存的内容。删除所有内容update.js.erb并尝试这个：

$('#flash').replaceWith("<%= j(render 'notifications') %>");
// Or
var flash = document.getElementById('flash'),
  flashParent = flash.parentNode;

flashParent.replaceChild("<%= j(render 'notifications') %>", flash);

就是这样！尝试一下，让我知道它是否有效。

再说一遍，这是我的手机。您可能需要修复一两个语法错误。

更多阅读 http://guides.rubyonrails.org/working_with_javascript_in_rails.html