LoginSignup
1
1

More than 1 year has passed since last update.

javascript FormDataオブジェクトの中身確認

Last updated at Posted at 2021-07-06

Every Qiita #4
のんびり独学初学者の毎日投稿チャレンジ 4日目
今回は・・・
自作コミュニティアプリ開発でフォームデータの中身をjavascriptで確認する際に躓いた時の備忘録です

FormDataで送られたデータを確認したい

index.js
const 任意の変数 = document.getElementById('任意のid');
定義した変数.addEventListener("イベント", function(event){
const data = 定義した変数.files[0];//input type=fileの場合
const form_data = new FormData();
form_data.append("任意のname",data);

FormDataインスタンスを作成するとinputから送られてきたデータを取得することができます。
何が送られているのか確認したいので、

console.log(form_data);

結果: FormData{}
あれ?
確認できない・・・

修正後

console.log(...form_data.entries());

結果: ["image",File]
0: "image"
1: File {name: "画像名.png"}
length: 2
確認できました!
オブジェクトなので、関数使って中身確認しないといけないみたいです。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1