Why does my .ajax request report ABORTED in Firebug?

Question

I've got the following code

    $(function(){
    $("#AddMaps").submit(function(){

        var $form = $('#AddMaps');

        $.ajax({
            type: 'POST',
            url: 'test_multiple.php',
            data: $form.serialize(),
            dataType: "json",
            beforeSend:function(){
                $('#ajax-panel').html('<div class="loading"><img src="loader.gif" alt="Loading..." /></div>');
                //alert(data);
            },
            success:function(data){
                $('#ajax-panel').empty();
                if (data.response != "Success"){
                    $('#ajax-panel').append('Error Occurred');
                }
                else {
                    $('#ajax-panel').append('File(s) Uploaded');
                }
            },
            error:function(){
                // Failed Request; Freak out
                $('#ajax-panel').html('<p class="error"><strong>Oops!</strong> Try that again in a few moments.</p>');
            }
        });
        return false;
    });
    });

When this event fires, Firebug reports that this event is Aborted. Additionally, in beforeSend the alert will not display any data (when uncommented, obviously). At this point, I'd suspect that data isn't being populated appropriately, but Firebug shows the correct data in the request: server=1&maps%5B%5D=europe.tar.bz2

Why is my request getting aborted?

Answer 1

As detailed by Reigel, AJAX cannot handle file uploads. (I hadn't know that myself until a couple of days ago.)

There is, however a Javascript object which is able to handle a file upload and be interacted with using jQuery. NOTE: This is not AJAX, in a traditional sense of the word, but does bridge the gap you are currently dealing with.

AJAX Upload