非同期処理でファイルを送る方法(jquery)

2017.01.14

Logging

<script type="text/javascript">
    $("#isubmit").click(function(){
        var formdata = new FormData($("#iform").get(0));//form ID
        $("#isubmit").prop('disabled', true);
        $.ajax({
            type : 'post',                      // HTTPメソッド
            url  : '/hoge/index.php',           // POSTするURL
            data: formdata,         // POSTするデータ
            processData: false,
            contentType: false,
            dataType: 'json',                   // レスポンスのデータ型
            success: function(obj) {      // 成功時の処理
                if(obj.err==""){
                    location.reload();
                    return false;
                }else{
                    var strComment = obj.err;
                    alert(strComment);
                    $("#isubmit").prop('disabled', false);
                }
                return false;
            },
            error: function(e) {                 // HTTPエラー時の処理
                var strComment = 'Server Error. Please try again later.';
                alert(e);
                $("#isubmit").prop('disabled', false);
            }
        });
    });
</script>

非同期処理でファイルを送る方法の勘所は2箇所。

        var formdata = new FormData($("#iform").get(0));//form ID

 

            processData: false,
            contentType: false,

これが大事な箇所です。この2箇所がないとファイルの非同期は
成立しません。
 

タグ

'disabled', 'Server Error, contentType, form ID, function, iform, index.php, isubmit, location.reload, new FormData, obj.err, Please try again later, processData, prop, return false, script type, script&gt, var formdata, var strComment, ファイル,