Загрузка файла Dropzone Dragn Drop? - PullRequest
       20

Загрузка файла Dropzone Dragn Drop?

0 голосов
/ 12 сентября 2018

Я использую Dropzone в качестве библиотеки JS для управления функцией перетаскивания, но она не работает.

Моя форма от Symfony:

{% extends 'base.html.twig' %}

{% block body%} {{form_start (form, {'attr': {'id': 'editform', 'class': 'dropzone'}, 'action': path ('objects_edit', {'id': id, 'import': import}), 'method': 'POST'})}}

<p>Bezeichnung:</p>
<p>{{ form_widget(form.designation) }}</p>
<p>Beschreibung:</p>
<p>{{ form_widget(form.description) }}</p>
<p>Straße / Hausnummer:</p>
<p>{{ form_widget(form.street) }} {{ form_widget(form.streetnumber) }}</p>
<p>PLZ / Ort:</p>
<p>{{ form_widget(form.plz) }} {{ form_widget(form.place) }}</p>
<p>Land:</p>
<p>{{ form_widget(form.country) }}</p>
<p><button type="button" id="validator" class="btn" style="width: 100%;" onclick="parseDataToAPI();">Validieren</button><br></p>
<p>X: {{ form_widget(form.coordL) }} Y: {{ form_widget(form.coordB) }}</p>
<p>Kategorie:</p>
<p>{{ form_widget(form.category) }}</p>
<p>{{ form_widget(form.logo) }}</p>
<p>{{ form_widget(form.images) }}</p>
<p>
    <div class="form-group">
        <label class="col-sm-2 control-label required" for="">Images</label>
        <div class="col-sm-12">
            <div class="dropzone" style="width:100%; height:200px; background-color: white;"></div>
        </div>
    </div>
</p>

{% if import == 1 %}
    <button style="width: 100%;" onclick="updateObject({{ id }}, '1');" class="btn" id="buttonupdate" disabled>{{ button_label|default('Speichern') }}</button>
{% else %}
    <button style="width: 100%;" onclick="updateObject({{ id }}, '0');" class="btn" id="buttonupdate" disabled>Update</button>
{% endif %}
{{ form_end(form) }}
{% endblock %}

{% block javascripts %}
{{ parent() }}
<script>
    // init,configure dropzone
    Dropzone.autoDiscover = false;
    var dropzone_default = new Dropzone(".dropzone", {
        paramName: "images",
        url: '{{ path('objects_edit', { 'id' : id, 'import' : 0 }) }}' ,
        maxFiles: 1,
        dictMaxFilesExceeded: 'Only 1 Image can be uploaded',
        acceptedFiles: 'image/*',
        maxFilesize: 3,  // in Mb
        addRemoveLinks: true,
        init: function () {
            this.on("maxfilesexceeded", function(file) {
                this.removeFile(file);
            });
            this.on("sending", function(file, xhr, formData) {
                // send additional data with the file as POST data if needed.
                // formData.append("key", "value");
            });
            this.on("success", function(file, response) {
                if (response.uploaded)
                    alert('File Uploaded: ' + response.fileName);
            });
        }
    });
</script>
{% endblock javascripts %}

enter image description here

Вот так это выглядит, но я не могу выбросить туда файлы. Если я добавлю туда файлы, браузер (в моем примере Chrome) откроет файл, и я смогу его прочитать.

Поздравления Daniel

...