Javascript formdata는 값을 추가하려고 할 때 비어 있습니다.

Question

다음 코드는 내 코드입니다. console.log(formData); 비어 있습니다. 실패 이유를 알 수 없습니다.

$("#add_meal_item").on('click', '#save_meal_item', function() { 
       var meal_name = $("#add_meal_item_form").find('#meal_name').val(); 
       var meal_type = $("#add_meal_item_form").find('#meal_type').val(); 
       var logoImg = $("#add_meal_item_form").find('#meal_image').get(0).files[0]; 
       var formData = new FormData(); 
       formData.append('logo', logoImg); 
       formData.append('meal_type', meal_type); 
       formData.append('meal_name', meal_name); 
       console.log(formData); 
       var ajax_url = baseurl + '/save_meal_item'; 
       $.ajax({ 
        url: ajax_url, 
        type: 'POST', 
        data: formData, 
        success: function (response) { 

        } 
       }); 

      }); 

Answer 1

은 먼저 요소의 값을 가져 다음이처럼, formData로 추가해야합니다

var meal_name = $("#add_meal_item_form").find('#meal_name').val(); 
formData.append('meal_name ', meal_name); 

을 그리고 모든 formData 키를 보여주고 당신이 FormData.entries 방법을 사용해야 할 값 :

for(var pair of formData.entries()) { 
    console.log(pair[0]+ ', '+ pair[1]); 
} 

을

Answer 2

FormData.append()은 formData에 대해 열거 가능한 속성을 만들지 않으므로 FormData.entries의 이터레이터를 사용해야합니다. 값을 평가하십시오.

(당신이 하나를 사용할 수 있었다 경우)`FormData` 인스턴스가 콘솔에 로그인, 일반 객체처럼되지 않습니다

var formData = new FormData(); 
 
formData.append('logo', "11"); 
 
formData.append('meal_type', "22"); 
 
formData.append('meal_name', "33"); 
 

 
console.log(Object.keys(formData)); //[] 
 
console.log(JSON.stringify(formData)); //{} 
 

 
//use iterator 
 
var formEntries = formData.entries(); 
 
//console.log(formEntries.next().value); 
 
//console.log(formEntries.next().value); 
 
//console.log(formEntries.next().value); 
 

 
//or simply use Array.from 
 
var formEntries = Array.from(formData.entries()); 
 
console.log("formEntries " , formEntries);