Sending JSON with AJAX/XMLHttpRequest - JavaScript Tutorial

In this video I'll take you guys through the process of sending JSON through an AJAX/XMLHttpRequest. It's super easy and doesn't require a library like jQuery.

We'll also take a look at using PHP to actually receive the data and parse it into a native object, which you'll need to do to actually use the data in the payload.

Support me on Patreon:

For your reference, check this out:

Follow me on Twitter @dcode!

If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!

#dcode #javascript #webdev

[dcode-software]

If you're unfamiliar with AJAX/XMLHttpRequest, check out my video on the topic:

[TheMisieq]

It is amazing how one single line of code can change EVERYTHING... Thank you for your short, but meaningful tutorial!

[yannik]

I was looking many days for a video like this (how I can access JSON Data with PHP sent from vanilla Javascript) and finally found it. You never fail to impress bro.

[sergeidubrovin]

Thank you, very simple, fast and clear

[yannik]

You're my favorite coding Youtuber. Enjoy every video from you mate!:)

[jcdeaton]

Thanks. Very helpful in December 2022. I've subscribed.

[DkGaming]

i like your video because you're not indian guy, and you are very good, ty bro

[MarbustVideosEntertainment]

Bro you're a hero without a cape, thanks, the best it's 100% javascript, I hate jquery, you save my life

[abhishekjaiswal]

When I am using. window.location.replace command to replace current page with another one then the json data is not sending to server, can you tell me why is it happening so please....?

[fabiomoreira]

Thanks a really short and direct tutorial for this matter.

I would love to know which extensions you use in your vs code too. maybe you can do a small video about it. keep it up !

[ahmedamr]

Thanks for the tutorial, I get a json syntax error. How can I validate the requestPayload?

[giancarloandrebravoabanto]

he is better than stackoverflow, hell

[tim]

So how to you apply this for a practical form, like an email subscription form?

[a.chithrai]

how to avoid HTTP Error 414. The request URL is too long while using AJAX/XMLHttpRequest

[riansefriadisefriadi]

thank you very much for the tutorial, I like this 😁😁

[monotoneJC]

This helped me so much, thank you! How would you pass two/multiple arrays to the php file using this method?

[arctic_frost]

Can you explain the url for POST? I'm having a hard time understanding where people get these mock up url links and where I can get one too, or if I can use a .js or .txt file?

[lesterllorca]

Hello there dcode, how can I redirect to the recieve.php page after posting the json object? I'm stuck

[yxngblader]

Can you help me please? I need only to POST to a server. And I write localhost:5000 and I get error:bad request. IDK what to do. HELP pls!!!!

[rickyu]

if http sends data in bits and pcs (stream/buffer) how does php server parse the body without 'parsing it' .. In node i think you cant simply log the request which will show the body like that. why the difference. thanks.