Ограничить Dropzone для загрузки только файлов определенного типа

Я загружаю файлы с помощью Dropzone, вот мой код

<div>
    <form id="mainDiv" class="dropzone needsclick" enctype="multipart/form-data" method="post" action="uploadFiles?type=5" role="form">

        <div class="dz-message needsclick">
            Drop files here or click to upload.<br />
            <span class="note needsclick">(Please upload <strong>PDF, JPG, GIF, PNG, PDF</strong> files only.)</span>
        </div>

    </form>
</div>


<div>
    <form id="recommendationDiv" class="dropzone needsclick" enctype="multipart/form-data" method="post" action="uploadFiles?type=5" role="form">

        <div class="dz-message needsclick">
            Drop files here or click to upload.<br />
            <span class="note needsclick">(Please upload <strong>PDF, JPG, GIF, PNG, PDF</strong> files only.)</span>
        </div>

    </form>
</div>

Загрузка работает нормально, однако я хочу ограничить тип загружаемых документов

<script>

  Dropzone.options.dropzone = {
        acceptedFiles:'image/*'       
    };


</script>  

Принятые файлы, кажется, не работают, он просто загружает все.


person Muhammad Umar    schedule 05.01.2018    source источник
comment
Какое бы решение javascript вы ни нашли, вы также должны обязательно отфильтровать эти файлы на стороне сервера (php или что-то еще). Безопасность на стороне клиента хороша для удобства пользователей, но бесполезна в качестве защиты на стороне сервера. Дважды проверьте все   -  person Emmanuel Delay    schedule 05.01.2018
comment
спасибо за совет @EmmanuelDelay тоже так сделает   -  person Muhammad Umar    schedule 06.01.2018


Ответы (1)


Вам нужно включить верблюжий идентификатор элемента dropzone. В вашем примере у вас есть <form> с id="recommendationDiv", поэтому вы должны установить параметры с помощью:

Dropzone.options.recommendationDiv = {
    acceptedFiles: 'image/*'
};

Вы устанавливаете параметры для несуществующей формы с идентификатором «dropzone». После настройки с правильным идентификатором вы должны увидеть правильное поведение:

Отказ файла Dropzone

См. документацию по настройке Dropzone.

person zero298    schedule 05.01.2018