jjzjj

javascript - meteor 上传清除/重置表单数据

coder 2023-10-30 原文

问题:meteor 中的表单数据是使用链接点击设置的，但在点击新链接时不会重置/更新。这会导致所有后续链接点击指向初始点击的文档(而不是新点击的文档)，因为每次点击后 formData 不会更新/重置

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

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

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

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

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

在此代码中，单击链接时，其 ID 存储在 session 变量中:

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")
            })
        }
    });

uploader 定义使用从 session 变量中提取的 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;
        }
    });
});

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

最佳答案

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

这是一个替代解决方案。使用 callbacks 而不是 formData 并添加一个带有表单数据的回调函数作为模板助手。

main.html

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

通用.js

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

关于javascript - meteor 上传清除/重置表单数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34457879/

javascriptmeteorcodeformData子目mongodb

有关javascript - meteor 上传清除/重置表单数据的更多相关文章

  1. ruby-on-rails - Rails 编辑表单不显示嵌套项 - 2

    我得到了一个包含嵌套链接的表单。编辑时链接字段为空的问题。这是我的表格:Editingkategori{:action=>'update',:id=>@konkurrancer.id})do|f|%>'Trackingurl',:style=>'width:500;'%>'Editkonkurrence'%>|我的konkurrencer模型:has_one:link我的链接模型:classLink我的konkurrancer编辑操作:defedit@konkurrancer=Konkurrancer.find(params[:id])@konkurrancer.link_attrib

  2. ruby - 解析 RDFa、微数据等的最佳方式是什么，使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2

    我主要使用Ruby来执行此操作，但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式，例如使用这个yaml文件，它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i

  3. ruby - 我可以使用 aws-sdk-ruby 在 AWS S3 上使用事务性文件删除/上传吗？ - 2

    我发现ActiveRecord::Base.transaction在复杂方法中非常有效。我想知道是否可以在如下事务中从AWSS3上传/删除文件:S3Object.transactiondo#writeintofiles#raiseanexceptionend引发异常后，每个操作都应在S3上回滚。S3Object这可能吗？？ 最佳答案 虽然S3API具有批量删除功能，但它不支持事务，因为每个删除操作都可以独立于其他操作成功/失败。该API不提供任何批量上传功能(通过PUT或POST)，因此每个上传操作都是通过一个独立的API调用完成的

  4. ruby - 如何在 Rails 4 中使用表单对象之前的验证回调？ - 2

    我有一个服务模型/表及其注册表。在表单中，我几乎拥有服务的所有字段，但我想在验证服务对象之前自动设置其中一些值。示例:--服务Controller#创建Action:defcreate@service=Service.new@service_form=ServiceFormObject.new(@service)@service_form.validate(params[:service_form_object])and@service_form.saverespond_with(@service_form,location:admin_services_path)end在验证@ser

  5. ruby - Ruby 有 `Pair` 数据类型吗？ - 2

    有时我需要处理键/值数据。我不喜欢使用数组，因为它们在大小上没有限制(很容易不小心添加超过2个项目，而且您最终需要稍后验证大小)。此外，0和1的索引变成了魔数(MagicNumber)，并且在传达含义方面做得很差(“当我说0时，我的意思是head...”)。散列也不合适，因为可能会不小心添加额外的条目。我写了下面的类来解决这个问题:classPairattr_accessor:head,:taildefinitialize(h,t)@head,@tail=h,tendend它工作得很好并且解决了问题，但我很想知道:Ruby标准库是否已经带有这样一个类？ 最佳

  6. ruby - 如何在 Ubuntu 中清除 Ruby Phusion Passenger 的缓存？ - 2

    我试过重新启动apache，缓存的页面仍然出现，所以一定有一个文件夹在某个地方。我没有“公共(public)/缓存”，那么我还应该查看哪些其他地方？是否有一个URL标志也可以触发此效果？ 最佳答案 您需要触摸一个文件才能清除phusion，例如:touch/webapps/mycook/tmp/restart.txt参见docs 关于ruby-如何在Ubuntu中清除RubyPhusionPassenger的缓存？，我们在StackOverflow上找到一个类似的问题：

  7. ruby-on-rails - 添加回形针新样式不影响旧上传的图像 - 2

    我有带有Logo图像的公司模型has_attached_file:logo我用他们的Logo创建了许多公司。现在，我需要添加新样式has_attached_file:logo,:styles=>{:small=>"30x15>",:medium=>"155x85>"}我是否应该重新上传所有旧数据以重新生成新样式？我不这么认为……或者有什么rake任务可以重新生成样式吗？ 最佳答案 参见Thumbnail-Generation.如果rake任务不适合你，你应该能够在控制台中使用一个片段来调用重新处理!关于相关公司

  8. ruby-on-rails - 有没有办法为 CarrierWave/Fog 设置上传进度指示器？ - 2

    我在Rails应用程序中使用CarrierWave/Fog将视频上传到AmazonS3。有没有办法判断上传的进度，让我可以显示上传进度如何？ 最佳答案 CarrierWave和Fog本身没有这种功能；你需要一个前端uploader来显示进度。当我不得不解决这个问题时，我使用了jQueryfileupload因为我的堆栈中已经有jQuery。甚至还有apostonCarrierWaveintegration因此您只需按照那里的说明操作即可获得适用于您的应用的进度条。 关于ruby-on-r

  9. ruby - 我如何添加二进制数据来遏制 POST - 2

    我正在尝试使用Curbgem执行以下POST以解析云curl-XPOST\-H"X-Parse-Application-Id:PARSE_APP_ID"\-H"X-Parse-REST-API-Key:PARSE_API_KEY"\-H"Content-Type:image/jpeg"\--data-binary'@myPicture.jpg'\https://api.parse.com/1/files/pic.jpg用这个:curl=Curl::Easy.new("https://api.parse.com/1/files/lion.jpg")curl.multipart_form_

  10. 世界前沿3D开发引擎HOOPS全面讲解——集3D数据读取、3D图形渲染、3D数据发布于一体的全新3D应用开发工具 - 2

    无论您是想搭建桌面端、WEB端或者移动端APP应用，HOOPSPlatform组件都可以为您提供弹性的3D集成架构，同时，由工业领域3D技术专家组成的HOOPS技术团队也能为您提供技术支持服务。如果您的客户期望有一种在多个平台（桌面/WEB/APP，而且某些客户端是“瘦”客户端）快速、方便地将数据接入到3D应用系统的解决方案，并且当访问数据时，在各个平台上的性能和用户体验保持一致，HOOPSPlatform将帮助您完成。利用HOOPSPlatform，您可以开发在任何环境下的3D基础应用架构。HOOPSPlatform可以帮您打造3D创新型产品，HOOPSSDK包含的技术有：快速且准确的CAD

随机推荐