я есть форма, которая имеет 3 входа:

[1] поле ввода текста для обновления статуса

[2] загрузка файла (для картинки)

[3] поле ввода текста для прикрепления ссылки

Пользователь переключается между каждым в зависимости от того, что он хочет сделать. Например, при выборе [2] входы [1] и [3] скрыты.

Все эти входные данные содержатся в одной форме с идентификаторомposts_form, Опции [1] и [3] отправляют через Ajax разные контроллеры.

Моя проблема сейчас с опцией [2], потому что невозможно загрузить изображения с помощью jQuery ajax.

Некоторые решения, которые я видел, включают в себя использование плагина jQuery Form, но мне интересно, возможно ли сделать загрузку изображений без использования плагина.

Например, это будет база кода для загрузки, которая, конечно, не работает.

    $.ajax({
        url: 'chat/upload/' + <?php echo $page_id; ?>,
        type: 'POST',
        data: $('#posts_form').serialize(),
        dataType: 'html',
        beforeSend: function(){
              $('#loading').show();
            },          
        success: function(html) {
            $('#attach').replaceWith(html);
            $('#loading').hide();
            $('#posts_form input').val('');
            $('.posts_link').val('');
            $('#chat_input').hide();
            }
        });

Любые предложения о том, что можно добавить / изменить, чтобы разрешить загрузку изображений с использованием только jQuery, без плагинов?

Благодарю.