3

私は完全にDropzone.jsで立ち往生しています、私はドラッグアンドドロップファイルのアップロードを作成したいと思います

設定は大丈夫です

<form id='test' enctype="multipart/form-data">
    <input type="text" name="album_name">
    <div id="myId" class="dropzone">

    </div>
    <button type="submit" id="newAlbum">go go</button>
</form>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://malsup.github.com/jquery.form.js" type="text/javascript" charset="utf-8"></script>
<script src="https://raw.github.com/enyo/dropzone/master/downloads/dropzone.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function(){
     $("#myId").dropzone({ 
        paramName: 'photos',
        url: "post.php",
        dictDefaultMessage: "Drag your images",
        clickable: true,
        enqueueForUpload: true,

        selectedfiles: function()
        {
            $('#newAlbum').show();
        }
    });

});
</script>

しかし、私はフォームをシリアル化して送信するための手がかりがありません

誰かが私に例を見せてくれませんか？

4

2 に答える 2

3

enqueueForUploadが（デフォルト）に設定されている場合true、ファイルは通常のファイルアップロードフォームのように直接アップロードされます。

あなたの場合、あなたはあなたのupload-scriptをに持っている必要がありますpost.php。そこで、ファイルは$_FILES['photos']（paramName）として入ります。このパラメータ名はデフォルトでは「ファイル」ですが、設定は異なります。

これは明らかですか？

したがって、ファイルの内容に関する簡単な例は次のpost.phpとおりです。

if(!empty($_FILES)){
   move_uploaded_file($_FILES['photos']['tmp_name'],'http://mysite.com/myDir');
}
于 2013-04-07T12:51:37.353 に答える
3

フォーム外に入力すると、フォームに値を追加できます

<input type="text" name="album_name">    
<form id='test' enctype="multipart/form-data">    
    <div id="myId" class="dropzone">

    </div>
    <button type="submit" id="newAlbum">go go</button>
</form>
<script type="text/javascript">
    Dropzone.autoDiscover = false;

    jQuery(function() {

        var myDropzone = new Dropzone("#test",{
            url: "post.php",
            addRemoveLinks: true,
            maxFilesize: 1,
            maxFiles: 5,
            uploadMultiple: false,
            parallelUploads: 100,
            createImageThumbnails: true,
            paramName: "photos",
            autoProcessQueue: false
        });

        var submitButton = document.querySelector("#newAlbum");
        submitButton.addEventListener("click", function() {

            myDropzone.on("sending", function(file, xhr, formData) {
                formData.append("album_name", $("input[name=album_name]").val());    
            });
            myDropzone.processQueue(); // Tell Dropzone to process all queued files.
            alert('show this to have time to upload');
        });

    });
</script>
于 2014-02-06T11:44:12.960 に答える