Wysyłanie pliku poprzez Ajax

Witam, piszę pewna aplikację pod system CMS Joomla i mam następujący problem. Aplikacja musi mieć w pewnym miejscu przesyłanie plików.

Plik projekty.js (tutaj znajduje się funkcja która poprzez ajax ma przekazywać plik do obsłużenia w PHP). Wykonanie ajax ma się odbywać natychmiast po umieszczeniu pliku w input file.

        //wysyłanie pliku
        $('table.materials').on('change', 'input[type=file]', function(){

            const formData = new FormData();
            formData.append('file', this.files[0]);

            $.post(
                'index.php',
                {
                    option: 'com_projekty',
                    task: 'project.placeFile',
                    format: 'json',
                    file: formData,
                    tmpl: 'raw'
                },
                'json'
            ).done((response) => {
                return response;
            });

        })

Plik PHP do obsługi pliku

    function placeFile() {

        echo "Test";
        var_dump($_FILES);

    }

Konsola javascript po dodaniu pliku w input text zwraca mi następujący błąd:

jquery-3.4.1.min.js:2 Uncaught TypeError: Illegal invocation
    at i (jquery-3.4.1.min.js:2)
    at qt (jquery-3.4.1.min.js:2)
    at qt (jquery-3.4.1.min.js:2)
    at Function.k.param (jquery-3.4.1.min.js:2)
    at Function.ajax (jquery-3.4.1.min.js:2)
    at Function.k.<computed> [as post] (jquery-3.4.1.min.js:2)
    at HTMLInputElement.<anonymous> (projekty.js:741)
    at HTMLTableElement.dispatch (jquery-3.4.1.min.js:2)
    at HTMLTableElement.v.handle (jquery-3.4.1.min.js:2)

Czy mógłby ktoś dać jakieś wskazówki, ewentualnie rozwiązanie w jaki sposób powinienem przekazać plik do funkcji placeFile() w PHP?

https://api.jquery.com/jquery.ajax/

processData (default: true)
Type: Boolean
By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.

Ogólnie sprawdź, czy masz poprawnie zdefiniowane właściwości w tym poście ajaxowym, wieki już nie używałem.

Udało mi się w ten sposób przetworzyć zapytanie Ajax jednak zmienna $_FILES zwraca pustą tablicę.

$.ajax({
                type: 'post',
                url: 'index.php?option=com_projekty&task=project.placeFile&format=json&tmpl=raw',
                processData: false,
                data: {
                    'file': formData
                }
            })

A co masz w formData przed wysłaniem formularza?

W pierwszym poście deklarujesz formData jako const. To chyba w następnej linijce append nie powinno zadziałać?

Nie. Const daje tylko to że nie można podmienić wartości/referencji zmiennej. Ale jak zmienna jest tablicą czy obiektem, to bez problemu można zmieniać zawartość.
Dlatego sporo osób nie lubi jsowego consta, bo ludzie spodziewają się czytając kod niemutowalności jak nie wiedzą co się naprawdę dzieje.

Wspomogłem się jeszcze YouTube'em. Takie rozwiązanie pomogło. Pozdrawiam i dziękuję za pomoc.

            const formData = new FormData();
            const files = this.files[0];
            formData.append('file', files);

            $.ajax({
                url: 'index.php?option=com_projekty&task=project.placeFile&format=json&tmpl=raw',
                type: 'post',
                data: formData,
                processData: false,
                contentType: false,
                success: function(response){
                    console.log(response);
                }
            })