Unable to recognize chosen file with autoform

Hi All,

I am having this problems where when I choose a file (school logo) in the interface to upload to my collection “Schools” and i try to submit the form, I get a “Image required” message, the same message I would get if there is no chosen image in the form, but I did choose an image and it looks like it is in the form. I see no other strange errors in the console or FS debug logs. All my packages and meteor are on the latest version. I have tried everything i could think of. Reinstalling all packages changing the CFS plugin from file system to gridfs. Anyone ever have experience with this problem?

Please find snippets of my code below. Any help would be appreciated:
template file (school_create.js)

{{#autoForm collection="Schools" id="school_create_insert" type="insert"}}
<fieldset>
  <legend>Add a School</legend>
  <div style="float:left">
    <div class="textField">
      {{> afQuickField name='name'}}
    </div>
    <div class="textField" style="margin-left:20px;">
      {{> afQuickField name='sub_domain'}}
    </div>
    
  </div>
  <div class="descriptionText">
    {{> afQuickField name='image' type="cfs-file" collection="images"}}
  </div>
  <div class="textField" style="margin-left:20px;">
    {{> afQuickField name="primary_color"}}
  </div>
</fieldset>
<button type="submit" class="btn btn-primary">Add a School</button>
{{/autoForm}}

school collection (school_collection.js)

Schools = new Mongo.Collection("Schools");


//Defining the schema
Schools.attachSchema(new SimpleSchema({
 name: {
type:String,
label: "Name",
max:200
},

image: {
type: String
},
 ...

common.js

FS.debug = true; // enable CFS debug logging


Images = new FS.Collection("images",{
stores:[new FS.Store.GridFS("images", {})]
})

Images.allow({
download: function () {
 return true;
},
fetch: null
});