ajax $ .postリクエストでfalseを返した後でもページがリロードされます

Question

フォームの送信後にajaxコールを使用して画像をアップロードしようとしています。問題が発生して新しいFormData($(this)[0])が表示されますが、私は間違っている場所に私を修正してください。

私のjavascriptのコード

$("#editImage").submit(function(){ 
var data = new FormData($(this)[0]); 
console.log(data); 
return false; 
$.post("../galImages", data).done(function(response){ 
    console.log(response); 
}); 
return false;}); 

私のHTMLコード

<form name="edit-image" id="editImage" action="" method="post" enctype="multipart/form-data"><input type="file" name="change-image" accept="image/*" class="form-control mb-20" value="Upload Image"> 
        <input type="hidden" name="edit-img-id" id="editImageId"><input type="submit" class="btn btn-primary" value="Save Changes" id="submitEditImgForm"></form> 

しかし件のデータをPHPページに掲載されている、そしてもう一つは、どのように私は一緒に隠しフィールドの値を送信することができますファイルフォームデータオブジェクト。私はajax $.postメソッドのnoobieです。誰かが何か考えているなら、私を助けてください。

Answer 1

あなたが画像をアップロードするように（私のミス、最初のことを忘れてしまった！）： 重要部品がもの​​ているそれ以外の場合は

$(function() { 
$('#my_form').on('submit', function (e) { 
    e.preventDefault(); 

    var $form = $(this); 
    var formdata = (window.FormData) ? new FormData($form[0]) : null; 
    var data = (formdata !== null) ? formdata : $form.serialize(); 

    $.ajax({ 
     url: $form.attr('action'), 
     type: $form.attr('method'), 
     contentType: false, // needed for upload 
     processData: false, // needed for upload 
     dataType: 'json', // return 
     data: data, 
     success: function (response) { 
      // response 
     } 
    }); 
    }); 
}); 

このコードは失敗します鉱山ではない、適応、それを見つけましたそれは以前の所有者には私が彼女/彼が誰であるか覚えていないので、元の所有者を信用できません：/

Answer 2

preventDefault()を使用すると、フォームとページのデフォルトの動作が再ロードされなくなります。

$("#editImage").submit(function (e) { 
    e.preventDefault(); 
    var data = new FormData($(this)[0]); 
    console.log(data); 
    return false; 
    $.post("../galImages", data).done(function (response) { 
     console.log(response); 
    }); 
    return false; 
});