Ajax отправка формы с файлом на jQuery

Не все так хорошо, как казалось - данный код не работает в IE! К сожалению, своего IE у меня нет - обычно "отбираю" ноут у кого-нибудь из родственников, но я таки переписал код по-другому (и не раз), и форма заработала. Новый пост тут.

Ни для кого не секрет, что через AJAX (XMLHttpRequest) нельзя отправить форму с файлом... в том смысле в каком все привыкли это делать обычным POST'ом. Весьма распространенный ход в этом случае - создать iframe, в нем форму, и отправить ее.

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

Допустим, вы создаете динамически (в оверлее) форму следующего содержания:

<form id="ajax_form" enctype="multipart/form-data" onsubmit="return false;">
<input type="text" name="some_text" /><br />
<input type="file" name="some_file" /><br />
<button onclick="ajaxPostForm()">Post</button>
</form>

и хотите, чтобы по нажатию на Post форма отправлялась через AJAX. Используя jQuery Form это можно сделать несколькими способами, я покажу наиболее близкий к $.post():

function ajaxPostForm() {
    // получим форму
    var form = $('#ajax_form');
    // обернем ее в IFrame - поступаем как при использовании практически любого jQuery плагина
    form.ajaxForm();
    // отправим форму - большинство параметров как у $.ajax()
    form.ajaxSubmit({
        url: '/path/to/form/processing/',
        success: function(data) {
            alert(data);
        }
    });
}

И some_text и some_file ушли на сервер. Ура!