DropZone JS не получает внешнее значение из поля ввода, называемого jQuery ID - PullRequest
0 голосов
/ 09 января 2020

У меня проблема с DropZone JS Получение значения input и передача его в сценарий загрузки. Загрузка работает, и все в порядке, КРОМЕ этого поля не отправляется в POST.

У меня очень базовая конфигурация c DZ:

$("#file_uploader").dropzone({
    url: '/ajax/upload.php',
    dictDefaultMessage: 'Drop photos or click here to upload',
    maxFilesize: 400000,
    params: {'project': $('#project-name').val()}, // This is the part I am having issues with
    success: function (file, response) {
        var obj = JSON.parse(response);
        if (obj.status === 'success') {
            console.log('gtg');
        } else {
            alert('upload failed');
            $(".dz-preview").remove();
        }
    }
});

У меня есть поле в мой html, который выглядит следующим образом:

 <input type="text" id="project-name" required="required"
       class="form-control col-md-6 col-xs-12 limited_form"
       placeholder="Project Name">

Если я просто перезаписываю 'project': $('#project-name').val(), чтобы выглядеть так:

'project': 'test'

Это работает. Поэтому Dropzone по какой-то причине не может «увидеть» это поле ввода.

Я подумал, что это может быть da sh в id project-name - Но согласно правилам в HTML5 тире разрешены в идентификаторах.

В консоли нет ошибок, и это:

// Testing if Selector is working
$(document).on('keyup', '#project-name', function () {
    console.log( $('#project-name').val() );
});

правильно отображает содержимое project-name в консоли при вводе, поэтому я знаю, что мой селектор в порядке. Таким образом, моя путаница в том, почему DropZone не «видит» его.

Почему DropZone «игнорирует» мой jQuery, идентифицируемый по идентификатору селектора? Я что-то упускаю явно неправильно?

ОБНОВЛЕНИЕ Стоит отметить, что мой конфиг лежит в пределах $(document).ready(function () { - Однако я пробовал это как внутри, так и вне функции и до сих пор проблема сохраняется.

1 Ответ

0 голосов
/ 09 января 2020

Ваш сценарий dropzone, вероятно, пытался получить значение до загрузки элемента в DOM. Загрузка вашего скрипта внутри функции $( document ).ready() будет одним из способов go. Другим способом было бы просто присвоить скрипт переменной и затем ссылаться на переменную в dropzone следующим образом:

$("#file_uploader").dropzone({
    url: '/ajax/upload.php',
    dictDefaultMessage: 'Drop photos or click here to upload',
    maxFilesize: 400000,
    params: {'project': function() {
      var x = $('#project-name').val();
      return x;
    }},
    success: /* some function */
});

Вы также можете попробовать напрямую вернуть входное значение в функцию и посмотреть, это работает.

$("#file_uploader").dropzone({
    url: '/ajax/upload.php',
    dictDefaultMessage: 'Drop photos or click here to upload',
    maxFilesize: 400000,
    params: {'project': function() {
      return $('#project-name').val();
    }},
    success: /* some function */
});
...