Rails + Refile + Dropzone (5)

_upload_modal.html.erb

<!-- Upload Doc Modal -->
<div
  class="modal fade upload-modal"
  id="upload-modal-<%= task.id %>"
  tabindex="-1"
  role="dialog"
  aria-labelledby="upload-modal-<%= task.id %>"
>
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <% @doc = task.docs.build %>
      <%= simple_form_for @doc, remote: true, html: { class: 'dropzone' } do |f| %>
        <%= f.hidden_field :doc_task_id %>

        <div class="modal-header">
          <button
            type="button"
            class="close"
            data-dismiss="modal"
            aria-label="Close"
          >
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">
            Upload Document for <%= task.name %>
          </h4>
        </div>

        <div class="modal-body">
          <div class="row">
            <!--  Dropzone -->
            <div class="col-sm-12">
              <div class="text-center clearfix" data-dz-clickable>
                <div class="col-sm-6 b-r">
                  <h4 class="text-center dz-message" data-dz-clickable>Drag File Here</h4>
                  <i
                    id="drop-zone"
                    class="upload-drop-zone fa fa-cloud-upload big-icon"
                  >
                  </i>
                </div>

                <div class="col-sm-6">
                  <h4 class="text-center dz-message m-b-lg" data-dz-clickable>
                    Or Browse Your Computer
                  </h4>

                  <a href="javascript:void(0);" class='btn btn-default btn-block'>Browse...</a>
                </div>

                <%= f.input :file, as: :attachment, direct: true, label: false, input_html: { class: 'hidden' } %>
              </div>

              <div class="dz-preview dz-file-preview">
                <div class="dz-details">
                  <img data-dz-thumbnail />
                  <div class="dz-filename"><span data-dz-name></span></div>
                  <div class="dz-size" data-dz-size></div>
                </div>
              </div>

              <!-- Progress Bar -->
              <div
                class="progress m-t-sm"
                role="progressbar"
                aria-valuenow="0"
                aria-valuemin="0"
                aria-valuemax="100"
              >
                <div
                  class="progress-bar"
                  style="width: 0%;"
                  data-dz-uploadprogress
                >
                </div>
              </div>
            </div> <!-- .dropzone -->
          </div>
        </div> <!-- .modal-body -->

        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">
            Cancel
          </button>
          <%= f.button :button, 'Upload', class: 'btn btn-primary' %>
        </div> <!-- .modal-footer -->
      <% end %>
    </div> <!-- .modal-content -->
  </div> <!-- .modal-dialog -->
</div> <!-- #upload-modal-<%= task.id %> -->