Element specyficzny dla alertów w [obiekt FormData] (do testowania)

Question

Próbuję sprawdzić zawartość zawartą wewnątrz obiektu [object FormData], a w szczególności wewnątrz określonego elementu, którego nazwa powinna być Name. Chciałbym go ostrzec, aby sprawdzić, czy treść jest poprawna, ale robi tak zwraca undefined:

alert(fd['Name']); 

Jestem całkiem pewien, że jestem ładowanie danych formularza poprawnie, więc zastanawiałem się, czy problem jest że mam dostęp do danych w niewłaściwy sposób ...

PS ostrzeganie tylko fd powraca [object FormData]

Answer 1

IvanZh poinformował mnie, że to podejście nie działa dla niego, co skłoniło mnie do przeprowadzenia pewnych badań w obiekcie HTML5 FormData. Jak się okazało, całkowicie się pomyliłem (patrz stara, niepoprawna odpowiedź poniżej). Wszystkie dane dla FormData znajdują się w natywnym kodzie . Oznacza to, że przeglądarka obsługuje dane dla pól formularzy i przesyłane pliki w języku, w którym jest realizowana.

Cytowanie MDN:

Uwaga: ... FormData obiekty nie są stringifiable obiekty. Jeśli chcesz, aby stringifyify przesłanych danych, użyj poprzedniego przykładu czystego AJAX . Zauważ też, że chociaż w tym przykładzie istnieją pewne pola pliku , po przesłaniu formularza za pośrednictwem interfejsu API FormData wykonujesz również nie musisz korzystać z interfejsu API FileReader: pliki są automatycznie ładowane i przesyłane automatycznie w postaci .

Nie ma sposobu, aby reprezentować tę informację w JavaScripcie, więc moja naiwna sugestia, aby po prostu go jako JSON serializacji nie będzie działać (co skłania mnie do zastanawiać się, dlaczego ta odpowiedź została przyjęta w pierwszej kolejności).

W zależności od tego, co próbujesz osiągnąć (np. Jeśli próbujesz tylko debugować), możliwe jest po prostu odrzucenie tej informacji ze skryptu po stronie serwera, który zwraca odpowiednie metadane JSON. W PHP można na przykład wysłać formularz FormData do analyzeForm.php, który może łatwo uzyskać dostęp do wszystkiego, co dołączasz do FormData w ramach odpowiedniego superglobalnego żądania. Skrypt strawi zawartość twojego formularza i zwróci odpowiednie informacje w łatwym do zanalizowania JSON. Jest to bardzo nieefektywne, więc prawdopodobnie nie nadaje się do środowisk produkcyjnych, ale jest czymś.

Old błędna odpowiedź:

można spróbować przy użyciu:

alert(JSON.stringify(fd)); 

aby zobaczyć tekstową reprezentację struktury fd.

Można również użyć console.log, ale jest to funkcja niestandardowa i nie ma gwarancji, że będzie obecna we wszystkich przeglądarkach.

Answer 2

należy zrobić:

console.log(fd['Name']); 

W większości przeglądarek, szczególnie w chrome, otwierasz narzędzia programistyczne (F12) i wyświetlasz konsolę.

Otrzymasz ładny, rozszerzalny widok obiektu i możesz go obejrzeć.

Answer 3

użytkownika Spokey umieścić mnie na tej techniki przy użyciu jsFiddle here który był bardzo przydatny w będąc w stanie „zobaczyć” wartości w obiekcie formData, podstawowa logika jest:

function submitFormFunction() { 
//create formData object 
var myFormData = new FormData(); 
// get the values from some input fields 
var myKey1 = $("input[name='my_field_one']").val(); 
var myKey2 = $("input[name='my_field_two']").val(); 
// append the values to the formData object, whilst also defining their key names 
myFormData.append("my_field_one",myKey1); 
myFormData.append("my_field_two",myKey2); 
// mock implementation - in order to view what is being sent 
var xhr = new XMLHttpRequest; 
xhr.open('POST', '/echo/html/', true); 
xhr.send(myFormData); 
} 

prostu zachować " Netto otworzy się w Firebug i będziesz mógł zobaczyć wartości.