rails form submit with remote => true -- js 文件呈现但不执行

Question

here 和 here 也有类似的问题，但都没有我想要的答案。我也做了很多搜索“rails format.js render”但无法解决这个问题。

在 Rails 4 中，我有一个经过验证的表单，如下所示：

<%= form_for(@message, :remote => true) do |form| %>
// don't want to call the js on submit here because 
// I don't want it to execute if the form did not validate

我在控制器中调用js：

def create
    @message = Message.new(params[:message])
      if @message.valid?
        NotificationsMailer.new_message(@message).deliver
        respond_to do |format|
          format.js { render "submit" }
        end
      else
        render :new
      end
  end

我在“messages”文件夹中有“submit.js.erb”：

alert('js was called!'); 

当我提交表单时，终端会验证文件是否呈现：

Rendered messages/submit.js.erb (0.5ms)

...但是在屏幕上，什么都没有发生。没有警报，也没有执行 javascript。我也尝试创建“submit.html.erb”并将我的 javscript 包装在脚本标签中，同样的事情发生了 - 文件加载，但脚本没有执行。

为什么？我需要做什么来告诉 Rails 执行 js？

编辑：在访问了 Kelvo 的资源并尝试了很多东西之后，答案似乎是将其添加到 application.js...

 $.ajaxSetup({  
    'beforeSend': function (xhr) {xhr.setRequestHeader('Content-Type', 'application/javascript');}  
 }); 

事实证明，我实际的“submit.js.erb”中的手动换行和缩进（因为它没有在我的 IDE 中包装）导致它无法执行，所以确实存在两个问题。

Answer 1

这可能是因为返回的内容没有被评估。浏览器确实收到了文件但不知道如何处理它，您必须包含一些 JavaScript 来处理响应，如 here 所述：

不过，您可能不想只是坐在那里填写<form>。您可能想在成功提交后做一些事情。为此，请绑定到 ajax:success 事件。失败时，使用 ajax:error。看看吧：

你可以试试

$(document).ready(function(){
  $("#new_message").on("ajax:success", function (e, data, status, xhr){
     eval(xhr.responseText);
  });
});

为了评估js代码。

您可以阅读更多关于“数据远程”请求期间触发的事件here

编辑：忘了说，这个脚本必须包含在包含表单的 HTML 文件中。也许只需将其添加到您的表单下即可。

Answer 2

这可能是由于返回的内容还包括您的默认布局。

试试这个：

format.js {render layout: 'no_layout', action: 'submit'}

希望这会有所帮助...