XF 2.2 Как загрузить файл на странице с помощью AJAX

Версия XenForo
2.2.2

kolya00736

Проверенные
Сообщения
10
Реакции
0
Баллы
138
Пишу страницу для загрузки файла и дальнейшей работой с ним.

php-обработчик:
PHP:
<?php
namespace test;

class test
{
    public static function includeFile(\XF\Pub\Controller\Page $controller, \XF\Mvc\Reply\View &$view)
    {
        if($_FILES){
            $view->setParam('myContent', 'test');
        }
    }
}

HTML-код шаблона:
HTML:
<div id="dropzone">
    <h1 id="droptext">Drag and Drop file</h1>
</div>
{$myContent|raw}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
    var dropzone = $('#dropzone');

    dropzone.on('dragover dragenter drop', function(e) { e.preventDefault(); e.stopPropagation(); });
    dropzone.on('drop', function (e) {
        e.stopPropagation();
        e.preventDefault();
        
        var file = e.originalEvent.dataTransfer.files;
        var fd = new FormData();
        
        fd.append('file', file[0]);
        uploadFile(fd);
    });
});

function uploadFile(file) {
    $.ajax({
        url: '{{ link('/test') }}',
        type: 'post',
        data: file,
        contentType: false,
        processData: false,
        success: function(data) {
            alert(data);
        }
    });
}
</script>

При отправке ловлю ошибку 400. Если отправлять файл через форму (xf:form), то все работает. Подскажите как мне сделать загрузку с помощью AJAX?
 
Посмотреть на то, как это реализовано в движке, а не писать кашу на голом PHP и JS.
окей, можешь подсказать, где найти этот шаблон вставки изображений в сообщениях?

1612717336238.png
 
Вы бы лучше показали, что и где вы хотите сделать
В узлах создал страницу. Теперь хотел сделать загрузку файла через drag and drop (как с загрузкой картинок в редакторе), чтобы дальше с ним работать в php-обработчике
 
kolya00736, посмотрите, как в XF реализована загрузка файлов через обычный input в форме, замена в дальнейшем input блоком для drag'n'drop`а не должна составить труда.
Только не надо в JS притягивать свой JQuery, у XF уже есть своя обертка для него.
 
  • Мне нравится
Реакции: Hope
Современный облачный хостинг провайдер | Aéza
Назад
Сверху Снизу