Dropzone.js没有提交文件

时间:2015-11-01 21:55:29

标签: php jquery dropzone.js

我已尝试过所有内容,但我无法通过dropzone.js将文件发送到服务器。我觉得必须有一些非常基本的东西,我不会来这里。

我现在尝试做的就是在用户选择文件时自动上传文件(样式并不重要)但它似乎没有触发我的PHP代码而我还是假设它没有提交(目标页面与调用它的页面相同)。

HTML:

<?php 
    if (!empty($_FILES)) {
        print "Files exist";
    }
?>

<ul class="submission_container">
    <li id="file_01" title="Click here to upload files">
        <div class="ledger_preview">
            <form action="/file-upload" class="dropzone" id="file-one">
                +
            </form>
        </div>
    </li>
</ul>

使用Javascript:

Dropzone.options.fileOne = {
    url: 'submit.php',
    paramName: 'file_01',
    method: 'POST',
    parallelUploads: 1,
    clickable: true,
    maxFilesize: 7,
    acceptedFiles: 'application/pdf',
    autoProcessQueue: true,
    dictDefaultMessage: '',
    dictFallbackMessage: '',
    dictFallbackText: '',
    dictFallbackText: '',
    dictInvalidFileType: '',
    dictFileTooBig: '',
    dictResponseError: '',
    dictCancelUpload: '',
    dictCancelUploadConfirmation: '',
    dictRemoveFile: '',
    dictMaxFilesExceeded: '',

    accept: function(file, done) {
        done();
    }
}

CSS:

li {
    list-style-type: none;
}

.submission_container {
    margin: 0 auto;
}

.ledger_preview {
    height: 7.647em;
    width: 12em;
    display: inline-block;
    border: 1em solid #A3A3A3;
}

.dropzone {
    text-align: right;
    font-size: 8em;
    font-weight: 900;
    color: #A3A3A3;
    display: inline-block;
    width: 100%;
    height: 100%;
}

FSFiddle(不含PHP): http://jsfiddle.net/qo4cLeco/

2 个答案:

答案 0 :(得分:0)

我看到表格中有 - action参数和Dropzone中的url参数。

Dropzone has to be specified on elements other than form (or when the form doesn't have an action attribute).

中的Url参数

在你的JsFiddle示例中,帖子是/ file-upload - 你确定你在那里等待上传的文件吗?或者你在submit.php等待他们?

我相信如果您删除不需要的那个 - 表单中的action参数或DropZone配置中的url参数,它们都可以正常工作。

答案 1 :(得分:0)

事实证明,我误解了所发生事情的机制。当我期待页面重新加载时,文件通过ajax调用提交。当我将PHP替换为将文件粘贴到服务器上所需的代码时,代码似乎有效。