Rails 5：JS调用后无法重定向（DropZoneJS）答案

【问题标题】：Rails 5: Can't redirect after JS call (DropZoneJS)Rails 5：JS调用后无法重定向（DropZoneJS）
【发布时间】：2016-10-21 13:42:20
【问题描述】：

我正在尝试在我的 Rails 5 应用中使用 DropZoneJS 实现拖放功能。我完成了文件的上传，但是当从 JavaScript 调用控制器时视图没有刷新（与正常上传完美配合）。

代码（仅对案例重要的部分）：

index.html.erb

<%= form_for(:printing_file, url: new_printing_file_path, html: {method: :post, class: "dragdropzone"} ) do |f| %>
    <div>Drag&Drop a file here</div>
<% end %>

<%= form_for(:printing_file, url: new_printing_file_path, html: {method: :post}) do |f| %>
    <%= f.file_field :file, class: "printing-file-upload-field", onchange: "this.form.submit()" %>
<% end %>

第一个表单用于拖放，第二个用于常规上传（重定向正常）。

printing_files.coffee

$(document).ready ->
  Dropzone.autoDiscover = false
  dropzone = new Dropzone('.dragdropzone',
    paramName: 'printing_file[file]'
    addRemoveLinks: false
    headers: { 'Accept': 'application/javascript' })

printing_files_controller.rb

def new
  @printing_file = PrintingFile.new(printing_file_params)
  @printing_file.user = current_user
  @printing_file.name = printing_file_params[:file].original_filename
  if @printing_file.save
    respond_to do |format|
      format.html { redirect_to files_path, notice: "File was correctly uploaded." }
      format.js
    end
  else
    redirect_to files_path, alert: "There was an error while uploading file."
  end
end

new.js.erb

console.log("This is never printed");
window.location = "<%= files_path() %>";

我还在我的printing_files_controller.rb 中尝试了几个选项，例如render js，但它们都不起作用。

输出：

PrintingFilesController#new as JS 处理

参数：{"utf8"=>"✓", "authenticity_token"=>"PBX2dbP8p+aZZXOkIIw1oFg3QZ02mDo+u+Z02NrBFCE+aNT3gWzwFjmQeGmcBcBItkg6l899iGIxuJljWDl+zA==", "printing_file"=>{"file"=>#, @ original_filename="9.stl", @content_type="application/octet-stream", @headers="Content-Disposition: form-data; name=\"printing_file[file]\"; filename=\"9.stl\ "\r\nContent-Type: application/octet-stream\r\n">}}

渲染printing_files/new.js.erb

渲染printing_files/new.js.erb (1.0ms)

请注意，js 文件正在渲染，但浏览器控制台没有显示任何内容。

【问题讨论】：

标签： javascript ruby-on-rails dropzone.js

【解决方案1】：

我相信您正在寻找 Dropzone 的成功参数：

$(document).ready ->
  Dropzone.autoDiscover = false
  dropzone = new Dropzone('.dragdropzone',
    paramName: 'printing_file[file]'
    addRemoveLinks: false
    headers: { 'Accept': 'application/javascript' })
    success: () -> location.reload()

您可以更改该函数内的 Javascript 位置。

【讨论】：

是一个很好的方法，但是会重新加载整个页面。我只想像redirect_to 那样重新加载文件视图。