Не работает отправка файлы в форме AJAX

[Krasi]

Данные отправляются и записываются в базу данных, но когда стал впридачу отправлять файл - его как будто файл php просто не видит и не получает. В чем дело?

<form id="article_form">
	    <input type="email" placeholder="Email" required>
	    <input type="text" name="title" style="line-height: normal;" placeholder="Название" required>
	    <input type="text" name="author" placeholder="Основной автор" required>
	    <input type="text" name="aubauthors" placeholder='Еще авторы через ","' required>
	    <textarea name="abstract" placeholder="Резюме" style="height: 70px; text-align: left; text-indent: 20px;" cols="20"></textarea>
		<!--<input type="file" name="f">-->
		<input type="file" name="audio_link" form="article_form" multiple id="js-file">

	    <div id="result" style="min-height: 5px;">
        	<!-- Результат из upload_article.php -->
        </div>
		<button id = 'js-button'>Отправить</button>
	</form>

$("#article_form").submit(function(event){
    event.preventDefault();
    
    sendAjaxForm('result', 'article_form', 'upload_article1.php');

    function sendAjaxForm(result_form, ajax_form, url) {
    jQuery.ajax({
        url:     url, //url страницы (action_ajax_form.php)
        type:     "POST", //метод отправки
        dataType: "html", //формат данных
        data: jQuery("#"+ajax_form).serialize(),  // Сеарилизуем объект
        success: function(response) { //Данные отправлены успешно
            result = jQuery.parseJSON(response);
            document.getElementById(result_form).innerHTML = result;
        },
        error: function(response) { // Данные не отправлены
            document.getElementById(result_form).innerHTML = "Ошибка. Данные не отправленны.";
        }
    });
}
		
});

Содержимое файла upload_article1.php

$("#article_form").submit(function(event){
    event.preventDefault();
    
    sendAjaxForm('result', 'article_form', 'upload_article1.php');

    function sendAjaxForm(result_form, ajax_form, url) {
    jQuery.ajax({
        url:     url, //url страницы (action_ajax_form.php)
        type:     "POST", //метод отправки
        dataType: "html", //формат данных
        data: jQuery("#"+ajax_form).serialize(),  // Сеарилизуем объект
        success: function(response) { //Данные отправлены успешно
            result = jQuery.parseJSON(response);
            document.getElementById(result_form).innerHTML = result;
        },
        error: function(response) { // Данные не отправлены
            document.getElementById(result_form).innerHTML = "Ошибка. Данные не отправленны.";
        }
    });
}
		
});

[p51x]

Так файл или имя файла? Если прям файл, то, собственно, где чтение файла то?

[Krasi]

Хороший вопрос, потому что в этом я плаваю.

<input type="file" name="audio_link" form="article_form" multiple id="js-file">

Вообще тут грузится сам файл. Ну реально через интерфейс я его гружу при каждом тесте... Затем моя логика такова, что на этой строчке передаются все данные формы, в том числе и файл...

data: jQuery("#"+ajax_form).serialize(),  // Сеарилизуем объект

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

[Valick]

не надо ничего сериализовать, работай с объектом формы

function setimage() {
    var $input = $("#uploadimage");
    var fd = new FormData;

    fd.append('img', $input.prop('files')[0]);

    $.ajax({
        url: 'http://example.com/script.php',
        data: fd,
        processData: false,
        contentType: false,
        type: 'POST',
        success: function (data) {
            alert(data);
        }
    });
}

https://wp-kama.ru/id_9026/jquery-aj...na-server.html
https://basecourse.ru/ajax/file.php

[Krasi]

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

 fd.append('img', $input.prop('files')[0]);

не камильфо, если будет 20 полей...

[Krasi]

актуально, что в моем случае делать то?

[Valick]

Я тебе уже ответил, что надо делать в твоём случае (использовать FormData). Но тебе оно не камильфо.
Не нарвится, жди когда я напишу универсальный обработчик, а напишу я его тогда когда у меня будет свободное время. Либо ищи в гугле сам.

[Krasi]

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

[Krasi]

Получилось, тема закрыта