ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – 将Dropzone.js与其他字段集成到现有HTML表单中

2019-09-17 07:33:21  阅读:280  来源: 互联网

标签:html javascript jquery file-upload dropzone-js


我目前有一个HTML表单,用户可以填写他们希望发布的广告的详细信息.我现在希望能够添加一个dropzone来上传待售商品的图片.我发现dropzone.js似乎完成了我需要的大部分工作.但是,在查看文档时,您似乎需要将整个表单的类指定为“dropzone”(而不仅仅是输入元素).这意味着我的整个表格成为了dropzone.是否可以在我的表单的一部分中使用dropzone,即仅将元素指定为类dropzone,而不是整个表单?

我可以使用单独的表单,但我希望用户能够通过一个按钮提交所有表单.

或者,是否有另一个库可以做到这一点?

非常感谢

解决方法:

这是另一种方法:在表单中添加带有classname dropzone的div,并以编程方式实现dropzone.

HTML:

<div id="dZUpload" class="dropzone">
      <div class="dz-default dz-message"></div>
</div>

JQuery的:

$(document).ready(function () {
    Dropzone.autoDiscover = false;
    $("#dZUpload").dropzone({
        url: "hn_SimpeFileUploader.ashx",
        addRemoveLinks: true,
        success: function (file, response) {
            var imgName = response;
            file.previewElement.classList.add("dz-success");
            console.log("Successfully uploaded :" + imgName);
        },
        error: function (file, response) {
            file.previewElement.classList.add("dz-error");
        }
    });
});

注意:禁用autoDiscover,否则Dropzone将尝试连接两次

博客文章:Dropzone js + Asp.net: Easy way to upload Bulk images

标签:html,javascript,jquery,file-upload,dropzone-js
来源: https://codeday.me/bug/20190917/1809000.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有