AjaxからPHPへのマルチパート・フォーム・データの中継

Question

私のHTMLにはフォームがあります。このフォームはアヤックスを通じて提出されます

HTML

<form class="article_properties_form" action="" method="POST" enctype="multipart/form-data">    
         <textarea style="display: none" class="inputNumber" name="pages"></textarea> 
         <p>Image</p> 
         <input style="padding: 0px" type="file" name="image"> 
          <p>Subtitle</p> 
          <input type="text" name="subtitle"> 

          <p>Text</p> 
          <textarea name="text" rows="4"></textarea> 
          <input id="properties_btn" type="submit" value="Submit/Update"> 
         </form> 

：

jQueryの/アヤックス

  $('body').on('submit', '.article_properties_form', function(e) { 
      e.preventDefault(); 

      if ($(this).valid()) { 
      $.ajax({ 
         type: 'POST', 
         url: '', 
         data: $(this).serialize(), 
         success: function() { 

         } 
        }); 
      } 

     }); 

データます。この形式は、テキストの入力と1つの画像を撮影しますPHPに中継する：

PHP

if (isset($_POST["subtitle"], $_POST["pages"], $_POST["text"], $_POST["image"])) 
    { 
       //Some SQL 
    } 

私はENCTYPEと入力タイプ= "画像" プロパティを削除すると、フォームが正常に動作します。つまり、私はimageプロパティに何か間違っている必要があります。このフォームをAjax経由でPHPにリレーする方法を把握することはできません。どうすればこれを達成できますか？

Answer 1

enctypeを保持し、ファイル値をキャッチする必要がある場合は、$_FILES['image']を使用して「イメージ」値を取得する必要があります。 AJAXコードで

、この使用：このお試しください

data: new FormData(this), 
processData: false, 
contentType: false 

Answer 2

を：私は画像の値を取得するためにPHPで$ _FILES [ "画像"]をやってみたこと

var fd=new FormData(document.getElementById("YOUR_FORM_ID")); 
$.ajax({ 
type:"POST", 
url:"", 
data:fd, 
enctype:'multipart/form-data', 
processData:false, 
contentType:false, 
success:function(data){console.log(data);}, 
error:function(err){console.log(err);} 
});