Метеор: как сохранить файлы с помощью «отправить форму» вместо событий «изменить»

Я пытаюсь отправить изображение ... и я занимаюсь этим последние два дня. Кажется, что это очень просто, но я не могу сделать это так, как хочу.

В примерах для collectionFS (и во всех других примерах, которые я могу найти) используется событие, которое называется «изменение». https://github.com/CollectionFS/Meteor-CollectionFS

Это событие будет обновлять и сохранять файл каждый раз, когда пользователь хочет загрузить изображение (или любой файл). Им не нужно нажимать «отправить», чтобы сохранить его.

Это правильный способ делать вещи? Я пытаюсь изменить его, чтобы я мог смешать событие с событием «отправить форму», но, похоже, это не работает.

 'submit form': function(event, template) {
  console.log('this logs')

  FS.Utility.eachFile(event, function(file) {
    console.log('this doesnt log');
    Images.insert(file, function(err, fileObj) {
      if (err) {
        // handle error
      } else {
        // handle success depending what you need to do
        var userId = Meteor.userId();
        var imagesURL = {
          "profile.image": "/cfs/files/images/" + fileObj._id
        };
        Meteor.users.update(userId, {
          $set: imagesURL
        });
      }
    });
  });
}

Однако это, похоже, не сохраняет файл. Он даже не запускает часть FS.Utility.eachFile. Я пробовал всевозможные варианты, но если бы я перечислил их все, боюсь, пост получился бы ужасно длинным. Я подумал, может быть, кто-то может указать мне правильное направление? Я попытался сохранить файл в переменную, а затем вставить их... но я не могу заставить FS.Utility работать с формой отправки.

Любая помощь приветствуется!


meteor meteor-helper collectionfs
person socialight    schedule 08.06.2015    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Для тех, кто будет бороться с этим позже, это проблема с предположениями, которые пакет делает в настоящее время (1-5-2015). В cfs_base-packages.js:

FS.Utility.eachFile = function(e, f) {
  var evt = (e.originalEvent || e);
  var files = evt.target.files;
  if (!files || files.length === 0) {
    files = evt.dataTransfer ? evt.dataTransfer.files : [];
  }
  for (var i = 0; i < files.length; i++) {
    f(files[i], i);
  }
};

Он ищет, чтобы ваше событие было структурировано следующим образом: event.originalEvent.target.files, однако событием, вызванным отправкой, является originalEvent.target: "" Таким образом, грязным обходным путем было бы сделать что-то вроде этого:

Template.templateName.events({
      'submit .myForumClass': function(event, template) {
        event.preventDefault();
        event.originalEvent.target = {};
        event.originalEvent.target.files = event.currentTarget[0].files; 
       //0 is the position of the input field in the parent form
        FS.Utility.eachFile(event, function(file) {
         Images.insert(file, function (err, fileObj) {
          //stuff
          });
       });
     },
  });
person Jackson Stone    schedule 05.01.2016

arrow_upward
0
arrow_downward

Надеюсь, приведенный ниже пример поможет.

<template name="fileupload">
  <form class="form-horizontal" role="form">
    <input type="file" name="...">
    <button type="submit" value="Update" class="btn btn-primary">Upload File</button>
  </form>
</template>

Template.fileupload.events({

  'submit form': function (event, template) {
    console.log("Submit form called");

    event.preventDefault();
    var fileObj = template.find('input:file');

    FilesCollection.insert(fileObj.files[0], function (err, fileObj) {
    });
  }
});
person anishcr    schedule 18.06.2015