How to pass files with jquery on regular form

I got this code, i would need to pass $_FILES to mail.php from /form form page/ is not passed with this type of jquery, a开发者_StackOverflow中文版nyone ?

    function send(datastr){
    $.ajax({    
        type: "POST",
        url: "mail.php",
    data: datastr,
        cache: false,
        success: function(html){
        $("#risposta").fadeIn("slow");
        $("#risposta").css("padding","20px");
        $("#risposta").css("height","auto");
        $("#risposta").css("border","1px solid #c98b18");
        $("#risposta").html(html);
        setTimeout('$("#risposta").fadeOut("slow")',2000);
    }
    });
}

I've yet to see a way to do this with AJAX. ATM, you will have to generate a form on-the-fly. The only problem with that is the user will have to select the file that you want to upload, and then from there you can continue automation.

I believe you cannot do this because ajax has no manipulation access to the files system of the server. It can only load data from server but can't manipulate the files in the server side (I guess, I think I read that somewhere).

However you can fake it using a hidden iframe. When you submit the form the information goes to the iframe which manipulate the files system of the server. Here's the tutorial: http://www.openjs.com/articles/ajax/ajax_file_upload/

You will notice that the page does load more data when you submit the form, but the page itself isn't reloaded.

There are also some plugins. The most known is jQuery Form Plugin.