POST Form Data as JSON with Fetch API in JavaScript

Hi, I'm Wesley. I'm a brand ambassador for Kinde. I'll help you master the latest tech here:

👉 Discord: all my courses have a private Discord where I actively participate

⏱️ Timestamps:
0:00 - Intro
0:37 - Use JavaScript to interact with form
2:22 - Get form data with FormData
3:28 - Convert form data to JavaScript object literal
4:35 - Use fetch() to send data (POST request)
5:30 - Convert data object to JSON

#formdata #fetch #fetchapi #javascript .
.

[wickedclamor]

First time on your channel but I liked it from the start. Great quality, nice audio, clear voice and content is exactly what the title says. Thank you.

[HarisSohail-qq]

Man. I am seeing you the first time, and I think you have brilliantly explained the concept. Awesome 💯

[mauricioknabben]

Thank you for all! Greetings from Brasil, this video helped me a lot with a college project

[kavindudilshan]

this is the best video i have fond in youtbe for JSON with Fetch API in JavaScript it is very good

[seekknowledge]

Sir you explain very well. I am amazed. ❤

[socialpeople]

Thank you!!! You helped me figure out the FormData.

[majorcodegeek]

Your video worked and so simple. Thank you so much

[marynakryvoruchenko]

Thanks for the video! Is there a json file that the information gets stored to so I could display it in another file?

[igorvenancio]

You're a really good teacher. Thanks

[edwintjoa]

Thanks for your video, you made it so easy to understand and implement.

[ajaygulani]

Thank you! this is exactly what I was looking for!

[metifu]

what about only specific form elements only like "user name" "terms of condition" for the Object?

[troymelok]

Hi, thanks for sharing. I don´t understand why is needed to convert to json if we can send FormData directly and then in the php file get data with POST if we use this method to send of course

[sinki]

When I try to console log my elements, it says « null » and when I try to send them to the api it says « failed to load resource: server responded with 401 ». Do you have ideas on how I could fix it ?
Thank you for your video

[koenstuurman]

Hi, Thanks for the amazing tutorial. I have 1 issue, I did the exact same thing, but I get the "form.html:82 Uncaught TypeError: Cannot read properties of null (reading 'addEventListener')" error. What could be the issue here?

[ibrohimahmadjonov]

How the page is not reloading after POST method, i cannot do that, please help

[muhamadrifqi]

Hi, Thank you so much for the amazing tutorial. I have 1 issue, I did the exact same thing, but I get the "crbug/1173575, non-JS module files deprecated." then the page is not working. What could be the issue here?

[yeonjoon]

Hiii the url u r giving how do I identify how can provide that url!?? Which url nd how can provide it crtly!?

[mikempaka]

Hi ByteGrad, I'm trying to Post from my Api I created in locahost and I have an '''error of SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data". Can it be possible to Post also in API in localhost?

[StephaniePena-wqpe]

Does this code works if I want to make a form that has to use json information ?