文書の過去の版を表示しています。

複数Dropzoneのやり方

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="js/dropzone.js"></script>
<style>
li {
    display: inline-block;
    margin:10px;
    background-color:#333;
    color:#fff;
    width:300px;
    height:300px;
}
</style>
</head>
<body>
<form action="next.php" method="post" enctype="multipart/form-data">
    <ul>
        <li id="dz-title" class="dz" data-name="title">
            dropzone
        </li>
        <li id="dz-content" class="dz" data-name="content">
            dropzone
        </li>
    </ul>
</form>
<script>
var myDropzone = {};

$('.dz').each(function(i, elem) {
    id = i + 1;

    console.log(id + ': ' + $(elem).data('name'));

    myDropzone[id] = new Dropzone('#dz-' + $(elem).data('name'), {
        url: 'up.php',
        paramName: $(elem).data('name'),
        maxFiles: 1,
        maxfilesexceeded: function(file) {
            alert('No more files please!');
            this.removeFile(file);
        },
    });
});
</script>
</body>
</html>

ゆーものメモ帳

サイドバー

複数Dropzoneのやり方

コメント

ゆーものメモ帳

ユーザ用ツール

サイト用ツール

サイドバー

複数Dropzoneのやり方

コメント

ページ用ツール