ajaxForm не отправляет на входе файла выберите изменение

Question

Эй, ребята, я пытаюсь отправить простую форму с типом ввода файла в нем. Проблема в том, что я хочу, чтобы отправка происходила при выборе файла.

Моя форма выглядит следующим образом:

<form id="uploadForm" action="submit.php" method="post" enctype="multipart/form-data">
    <div class="fileUpload btn btn-lg btn-primary">
        <span>Choose File</span>
        <input id="imageBtn" type="file" class="upload" name="image"/>
    </div>
</form>

Мой JavaScript выглядит следующим образом:

$("input#imageBtn").change(function () {
        console.log("submitting...");
        // bind to the form's submit event
        $('#uploadForm').submit(function() {
            console.log("submitting...form");
            $('#uploadForm').ajaxSubmit();
            return false;
        });
});

По какой-то причине я вижу только "отправка..." в моей консоли и ничего кроме этого и ничего не отправляется.

Любая помощь будет принята с благодарностью!

Спасибо.

Answer 1

Следующее похоже на работу.

<form id="imgForm" action="action.php" method="post" enctype="multipart/form-data">
        <div class="fileUpload btn btn-lg btn-primary">
            <span>Choose File</span>
            <input id="imageToBeUploaded" type="file" class="upload" name="image"/>
        </div>
</form>

$("body").on('submit', '#imgForm', function(){
    $(this).ajaxForm({target:'#uploadStatus'});
    console.log("submitting...");
    return false;
});

/* Uploading Profile BackGround Image */
$('body').on('change','#imageToBeUploaded', function() {
    //submit the form
    $("#imgForm").submit();
});

Answer 2

Из документации jQuery:

Событие submit отправляется элементу, когда пользователь пытается отправить форму. Он может быть прикреплен только к элементам. Формы могут быть отправлены либо нажатием явного ввода type="submit", input type="image", либо кнопки type="submit", либо нажатием Enter, когда определенные элементы формы имеют фокус.

https://api.jquery.com/submit/

Попробуйте добавить соответствующий тег, например

<input id="imageBtn" type="file submit" class="upload" name="image"/>