Using Dropzone.JS to upload via orion.filesystem with drag and drop support.

submit_form.html

<template name="submit_form">

<div class="alert alert-success" style="display: none;" role="alert">
  <strong>Your work has been submitted!</strong> You successfully submitted your work. It is now in-review.
</div>

<div class="well">
  
  {{# with job }}
  <h3 class="text-info job-name" data-job-id="{{ _id }}">{{ name }}</h3>
  <p>{{{ description }}}</p>
  {{/ with }}
  
  <div class="form-group">
    <div id="dropFrame" class="dropzone" data-file=""></div>
  </div>
  
  <div class="form-group" data-required="true">
    <label for="status" class="control-label">Status</label>  
    <select name="status" id="status" required="" data-schema-key="status" autocomplete="off" class="form-control">    
      <option value="">(Select One)</option>
      <option value="Draft">Draft</option>
      <option value="Final">Final</option>
    </select>
    <span class="help-block"></span>
  </div>
  
</div>

<a class="btn btn-success btn-lg btn-submit btn-spacing pull-right">Submit Work</a>
<a class="btn btn-warning btn-lg btn-cancel btn-spacing pull-right">Cancel</a>

</template>

submit_form.js

Template.submit_form.events({
  'click .btn-submit': function() {
    $('.btn-submit').fadeOut();
    $('.btn-cancel').fadeOut();
    
    var jobId = $(".job-name").data("job-id");
    
    Work.insert({
      job: jobId,
      document: {
        fileId: $(".dropzone").data("file").fileId,
        url: $(".dropzone").data("file").url
      },
      status: $("#status").val(),
      createdBy: Meteor.userId(),
      createdAt: new Date().toISOString()
    });
    
    Jobs.update(jobId, {
      $set: { status: "In-Review" }
    });
    
    $('.well').fadeOut('medium', function() {
      $('.alert-success').fadeIn();
    });
  }
});

Template.submit_form.rendered = function() {
  Dropzone.autoDiscover = false;
  
  if ($('#dropFrame').length) {  
    var dropzone = new Dropzone("div#dropFrame", {
      url: '/upload',
      dictDefaultMessage: 'Drop file here or click to upload.',
      maxFiles: 1,
      accept: function(file, done) {      
        var self = this;
        var upload = orion.filesystem.upload({
          fileList: self.files,
          name: file.name,
          uploader: 'dropzone'
        });
        
        Session.set('isUploading_' + file.name, true);
        Session.set('uploadProgress_' + file.name, 0);
        
        Tracker.autorun(function() {
          if (upload.ready()) {
            if (upload.error) {
              Session.set('file_' + file.name, null);
              console.log(upload.error);
              alert(upload.error.reason);
            } else {
              Session.set('file_' + file.name, {
                fileId: upload.fileId,
                url: upload.url
              });
              
              $(".dropzone").data("file", {
                fileId: upload.fileId,
                url: upload.url
              });
            }
            Session.set('isUploading_' + file.name, false);
          }
        });
        
        Tracker.autorun(function(){
          Session.set('uploadProgress_' + file.name, upload.progress());
          $(file.previewElement).find(".dz-upload").css('width', upload.progress() + '%');
          file.upload.progress = upload.progress();
          if(upload.progress() == 100) {
            $(file.previewElement).find(".dz-progress").fadeOut();
            $(file.previewElement).removeClass("dz-processing").addClass("dz-success");
          }
        });
      }
    });  
  }
}

Template.submit_form.helpers({
  job: function() {
    var job = Jobs.findOne({ _id: RouterLayer.getParam('jobId') });
    return job;
  }
});

Hi @jeremyhodges,

I would like to ask if after you upload your files, does the filename retained?