Осуществление DropZone.js правильно, лучшая практика?

#javascript #php #dropzone.js

Вопрос:

Я пытаюсь понять, как реализовать DropZone.js правильное использование PHP.

Моя настройка заключается в том, что у меня есть основная форма с кучей полей, а затем форма dropzone сбоку. Каждый раз, когда добавляется файл upload.php вызывается, который перемещает файл из временной папки в конечное место назначения. Когда основная форма, наконец, отправлена, я добавляю поля в базу данных вместе с именами файлов, которые я добавил в папку.

Но если файл добавляется, а затем удаляется в пользовательском интерфейсе dropzone, запускается событие «removedfile». Но это javascript. И javascript не может удалять файлы, поэтому я не могу удалить файл из конечного пункта назначения, в который я его переместил. Итак, как я могу отслеживать, какие файлы предназначены для использования при сохранении основной формы? Я подумал об использовании событий «завершено» и «удален файл» для вызова функций, которые динамически создают/удаляют скрытые поля, содержащие имена файлов. Но, возможно, я слишком далеко свернул с главной тропы. Что мне делать? Мой опыт работы с php и javascript довольно ограничен, и я не уверен, как подойти к этой ситуации.

Редактировать: Итак, короче говоря, upload.php страница перемещает загруженные файлы в нужную папку, но когда пользователь нажимает, чтобы удалить файл, ничего не делается для его удаления, он просто удаляется в пользовательском интерфейсе, но остается на диске, так как сервер узнает, какие из них «настоящие», а какие просто остатки, которые следовало удалить?

Комментарии:

1. Действительно, вам нужно будет отправить код, чтобы показать, где вы находитесь и где что-то ломается. Хотя одна вещь And javascript can't delete files — правда, но javascript может вызвать процесс ajax, который инструктирует PHP разорвать связь() с файлом, если это ваше желание, тогда JS может делать все, что отображает обновления

2. Я должен был это сделать. Я просто подумал, что, возможно, были какие-то лучшие образцы практики для использования.

Ответ №1:

Я решил ее так, как думал изначально. С небольшим количеством jQuery и добавлением/удалением скрытых полей ввода:

 function onCompletedFile(file)
{
    console.log("Completed file:");
    console.log(file);

    $('#mainform').append('<input type="hidden" name="images[]" value="'   file.name   '" id="'   file.upload.uuid   '"/>');
}

function onRemovedFile(file)
{
    console.log("Removed file:");
    console.log(file);

    $('#'   file.upload.uuid).remove();
}
 

а затем в настройках выпадающей зоны:

 this.on("complete", function(file) { onCompletedFile(file); });
this.on("removedfile", function(file) { onRemovedFile(file); });
 

и на странице, на которую я отправляю свою основную форму, я могу просто повторить ее, вот так:

 foreach( $_POST['images'] as $value ) 
 

.. и получите имена файлов, которые загружены и фактически предназначены для использования.