流星上传清除/重置表单数据

Question

问题：流星中的表单数据是使用链接点击设置的，但在点击新链接时不会重置/更新。这会导致所有以下链接点击指向初始点击的文档（而不是新点击的文档），因为每次点击后 formData 不会更新/重置

我有一个测试 web 应用程序 (http://meteorpad.com/pad/ckgN6GL4msQn4Ms5h/Jobs)，其中导航菜单中的链接从集合中调用不同的文档并显示数据

部分数据显示是上传部分。单击链接时，该文档的 id 存储在会话变量中。然后将其作为 id 在 formData 中传递，以便上传者可以创建一个与文档 id 同名的目录。为该文档上传的文件然后存储在该特定文件夹中

这适用于我点击的第一个链接。文件被上传到带有其名称的子目录。但是，当我单击新链接时，我上传的所有文件都会上传到第一个文档目录

我相信这是因为表单没有重新加载，因此 formData 仍然具有第一次点击的文档链接的 id。

通过这种设置，我如何在点击链接时重置表单数据，以便它始终传递最新的 id，而不是第一个？

在这段代码中，当一个链接被点击时，它的 ID 被存储在一个会话变量中：

Template.job.events({
        "click #jobItem": function(event){
            Session.set("selectedJob", this._id);
        }
    });

文档信息以这样的模板显示：

<template name="summary">
  {{#with summary}}
  <div id="summaryContainer">
    <p>Name: {{name}}</p>
    <p>Created at: {{createdAt}}</p>
    <p>Username: {{username}}</p>
    <p>Script location:</p>
    {{> upload_bootstrap multiple=false formData=specificFormData}}
    <p>Upload file location:</p>

    <button class="deleteJob">Delete Job</button>
    <button class="saveJob">Save</button>
    <button class="startJob">Start</button>
  </div>
  {{/with}}
</template>

所以上传表单名为specificFormData，这是一个摘要模板帮助函数：

Template.summary.helpers({
        summary: function(){
            var curJob = Session.get("selectedJob");
            return Jobs.findOne( { _id:curJob } );
        },

        specificFormData: function(){
            return({
                id: Session.get("selectedJob")
            })
        }
    });

上传器定义使用从会话变量中提取的 formData ID 创建一个子目录：

Meteor.startup(function () {
    var dir = '/job/';

    UploadServer.init({
        uploadDir: process.env.PWD + dir,
        tmpDir: process.env.PWD + dir + 'tmp/',
        checkCreateDirectories: true,
        getDirectory: function(fileInfo, formData){
            return formData.id;
        }
    });
});

因此，当第一次单击作业时，会存储一个会话变量。然后，显示页面仅从集合中提取该文档信息。表单数据存储 ID 并使用作业 ID 创建子目录。再次单击链接时，表单数据 ID 不会重置，并尝试上传到相同的先前目录，而不是新单击的文档目录。 它应该根据点击的作业上传到不同的子目录

Answer 1

我认为这是一个错误，根据this issue，它应该已在tomi:upload-jquery v2.2.0 中修复，但它似乎仍在发生，如您的示例所示。

这是另一种解决方案。使用callbacks 代替formData 并添加一个回调函数，将表单数据作为模板助手。

main.html

<template name="summary">
    {{> upload_bootstrap multiple=false callbacks=myCallbacks}}
</template>

common.js

Template.summary.helpers({
    myCallbacks: function() {
        return {
            formData: function() { return({id: Session.get("selectedJob")}) }
        }
    }
});