UPDATE: Learn how to use AJAX to load data from an external file straight into your HTML tables: kzbin.info/www/bejne/Z2PXm5uVa91_aK8
@mouthbreather2806 жыл бұрын
Very Great Video! Codecademy doesn't even go into any detail or depth as for the purpose for the actual commands used. Really helped understanding the process more. Thanks for the great content and tutorial man! :)
@dcode-software6 жыл бұрын
Thank you 😁 and you're welcome
@varletconstundefined5 жыл бұрын
amazing simple to the point. great introduction. i had zero knowledge before the video after it i googled for some other videos , and it was simple after your. Thanks man :)
@dcode-software5 жыл бұрын
No worries mate 😁
@varletconstundefined5 жыл бұрын
@@dcode-software one more question please do you know a good resource to study React i'm currently working on Fetching API and consuming it. then i wanna learn one framework. any good resource will help 😁
@greatpandas995 жыл бұрын
You're a lifesaver man, I really appreciate this. Thanks
@conanchambers4664 жыл бұрын
Wow! I understand that syntax has changed but with your explaining my understanding has vastly improved so so much! Thankyou!
@99HAXXOR2 жыл бұрын
watching this video in 2022, you sir is "GREAT". it helped me a lot
@galbeeyutdmok6515 жыл бұрын
Hey Dom , do you like to use the DOM ?
@dcode-software5 жыл бұрын
Hi there. Yes, I love using the DOM.
@DominicNweze2 жыл бұрын
Y'all be using me raw. 😂
@imcw7 жыл бұрын
nice code editor + blue switch + good content + beautiful cover image. Love your videos, dcode! p.s: it would be great if you record in 60fps
@dcode-software7 жыл бұрын
+Cương Trần Thank you! That means a lot - glad you enjoy 😁
@redsquirrel38936 жыл бұрын
If you do do a high frame rate for Cương Trần and any others please keep the current 1080 option I actuality prefer it as the resolution matters way more for tutorials so you can see the code clearly and both make it take longer to load (my crappy Internet). 1080 with the current frame rate is perfect for me. Also thanks keep up the good work.
@mouthbreather2806 жыл бұрын
@ Cương Trần There's no point. It's a text tutorial not a skateboarding tutorial that you'd rather see smoother motion. It will make such minuscule negligible difference for this kind of video. All it will accomplish is stressing dcode's computer more and making the file size larger. resolution matters over > fps in this case because we'd rather see the code sharp instead of blurry.
@Devronization5 жыл бұрын
Great video. Thanks a lot. I like your teaching style. Keep up the good work.
@dcode-software5 жыл бұрын
No worries mate, cheers!
@GlenMillard4 жыл бұрын
I learned quite a bit from your video - thanks much! It was excellent! :)
@dcode-software4 жыл бұрын
No problem 😁
@vuedev63242 жыл бұрын
beautiful explanation of XMLHTTPREQUEST( ); TYSM ❤
@erfelipe4 жыл бұрын
Quick, clean and direct. Thanks.
@Good-Enuff-Garage3 жыл бұрын
absolutely positively brilliant example
@kleb20105 жыл бұрын
Great video, helped a lot :)
@dcode-software5 жыл бұрын
All good, mate
@zenziiiiiiiiii6 жыл бұрын
Thanx for making the video, I really needed this explanation.
@dcode-software6 жыл бұрын
No probs!
@mistakenmillenial68346 жыл бұрын
Thank you so much for this video. It helped me a lot.
@dcode-software6 жыл бұрын
Yeh no worries mate!
@LadyCrowNinthPlague4 жыл бұрын
Thank you so much!!!! Just what I needed😊😊
@dcode-software4 жыл бұрын
No problem 👍
@mortenrobinson3 жыл бұрын
0:48 why? I thought you just said Ajax were for making requests to other websites, webservices and webpages? So you're going to use ajax to request a local text file from yourself? And it even has to be in the same directory? Where do the external websites, webservices and webpages enter the picture?
@roffe84305 жыл бұрын
Awesome video! :D
@dcode-software5 жыл бұрын
You're welcome mate 😁
@Emassei6 жыл бұрын
Thank you helped me out a lot!
@dcode-software6 жыл бұрын
No worries 😁
@moddingdudes70555 жыл бұрын
Thank you for this video very much. It fits very well when you read a little bit of the W3Schools page and I was still a little confused but you cleared all of that up and I thank you for that. I also believe in your xhr.readystatechange function you can use this.readystate and this.status instead of xhr.readystate or xhr.status. Thank you for your help though.
@dcode-software5 жыл бұрын
No worries mate, using "xhr" over "this" depends on if you're using an arrow function or standard function
@t3chnicolor3 жыл бұрын
ID on the keyboard, switches and keycaps you’re using?
@royalbhati78376 жыл бұрын
Amazing explanation :D
@dcode-software6 жыл бұрын
Thank you mate, glad it helped
@royalbhati78376 жыл бұрын
@@dcode-software Just saw few of your videos and your explanations are really good,Hope it grows :)
@4u40005 жыл бұрын
I ran the same code on my file system and i get a CORS error. How can i resolve this issue?
@minach695 жыл бұрын
I have the same issue
@malteeaser1015 жыл бұрын
I got that when trying to access a different site or sending a request to the local file system. I think it is a security thing, maybe. It works fine when requesting files from the server that the original HTML file came from.
@dcode-software5 жыл бұрын
Generally speaking you can't fix this "issue" - it's a security feature enforced by the web browser. The reason it's happening is because you're trying to access a resource from a different origin (or site). If you'd like to get around this problem you need to have access to the web server which is providing the resource and set the Access-Control-Allow-Origin header accordingly.
@Meleeman0114 жыл бұрын
put the file on a local server such as a node.js server or nginx/apache server. I think node is easiest, you could run a dev server with node server.js and have server.js serve your file to localhost:3333 or whatever port, reference that in your xhr.request and as long and you have your development server running you can locally test without a CORS issue.
@wemode29984 жыл бұрын
Great video. Concise and very informative
@robot677993 жыл бұрын
You deserve a subscribe. BTW which theme you are using in atom?
@yasirwisal80815 жыл бұрын
Well done Right on the point, thanks
@dcode-software5 жыл бұрын
No dramas :)
@nonetrix30663 жыл бұрын
I've only used JSON until now one of the APIs I use supports both any reason to chose one over the other?
@missinglink24163 жыл бұрын
what type of data can be returned by the xmlhttprequest object?
@Good-Enuff-Garage3 жыл бұрын
Failed to load response data. No data found for resource with given identifier.
@ilikespaghetti21706 жыл бұрын
can you make just like this one but if you click a button it will function the XML HTTP Requests
@filmlife10005 жыл бұрын
i keep getting this error: index.html:30 Access to XMLHttpRequest at 'file:/..../dom.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https. Any idea what I'm doing wrong?
@hyperspace22234 жыл бұрын
That’s because you’re using a file, you need nodejs
@filmlife10004 жыл бұрын
@@hyperspace2223 Thanks for the reply - can't believe I used this over a year ago! I've changed to Scala now - haven't touched JS in ages :0
@hyperspace22234 жыл бұрын
@@filmlife1000 You're welcome :D
@hyperspace22234 жыл бұрын
Best XHR tutorial! Tried googling but couldn't find any helpful results.
@samsam-zu7zc4 жыл бұрын
Your logo is beautifully designed
@owenharrison80125 жыл бұрын
Great tutorial! Thank you very much!
@shiyoh-82895 жыл бұрын
Thank you for sharing the video! I use same code as you said but I got error code related to CORS, it said "Access to XMLHttpRequest ...from origin 'null' has been blocked by CORS policy"
@shiyoh-82895 жыл бұрын
and I found that I just forgot to add the if statement about "Readystate ==4" when i add it everything go well
@PratikSahu185 жыл бұрын
AJAX only works in server , not in local directories
@scallywagin4 жыл бұрын
Hey guys, im getting this error "Uncaught TypeError: Cannot set property 'textContent' of null at XMLHttpRequest.xhr.onreadystatechange", any idea? I literally copied Dom's exercise............
@DanielHernandez-zx4kj4 жыл бұрын
Thank you so much for this video!!
@mackymichel80523 жыл бұрын
Thanks a lot. But I'd like to know what the header is, plz.
@10a3asd5 жыл бұрын
I don't understand how the script you wrote knows where to send the GET request to. What if you were sending the GET request to a web service?
@BlokeBritish3 жыл бұрын
hows it going my name is Don - that standard tone in every video is a killer haha
@dcode-software3 жыл бұрын
Looooooool
@osasferguson2 жыл бұрын
Great content
@davidgrig46083 жыл бұрын
great explanation thx
@pjmclenon4 жыл бұрын
hello my API keeps retruning HTML and so i cant run my search box to call the API do you know how to solve this issue? in your code i get null and so i have to comment out responseType line and then i just get HTML code in the console this is a sample API call @t thxz for any help i been trying to solve this myself and online for 3 weeks Lisa does anyone know the fix for this? i followed the code for fetch from david ceccia but i still get only HTML and so i will also get cant parse error < because thats the 1st caracter of an HTML page
@intellsoft5 жыл бұрын
How do you send a XHR request to a Laravel controller and returns data to the view.
@mackensonreginaldmichel3993 жыл бұрын
Very good explanation. But I'd like to know when and why use it? Do we not need server-like languages anymore if we can use this? Thanks a bunch!!!
@shubhamarora5476 жыл бұрын
gr8 video sir
@dcode-software6 жыл бұрын
Thank you mate, glad it could help you
@Meleeman0114 жыл бұрын
For those having CORS issues, put the file on a local server such as a node.js server or nginx/apache server. I think node is easiest, you could run a dev server with node server.js and have server.js serve your file to localhost:3333 or whatever port, reference that in your xhr.request and as long and you have your development server running you can locally test without a CORS issue.
@gamersoul10983 жыл бұрын
i saw one youtuber he was able to use file from local storage without cors error
@gamersoul10983 жыл бұрын
so is there any solution for cors error with out node.js ?
@gokharol4 жыл бұрын
Could I pass on an external URL for instance xhr.open('get', 'www.google.com',true) ? I'm looking forward to get elements by ID in real internet pages, do you think I need "CORS" first hand?
@gamersoul10983 жыл бұрын
hiii could you solve cors error please tell me
@harsheenajunejo29815 жыл бұрын
Hi, How to store the XHR response as an array or JSON object by using javascript only. Can you please guide me on how to obtain that
@dcode-software5 жыл бұрын
I have plenty of videos on that, for example: kzbin.info/www/bejne/jWexpHSFZZ2po6c
@jeel73732 жыл бұрын
THANK YOU THANK YOU SO MUCH SIR 👑👑👑👑👑🇮🇳😀
@dcode-software2 жыл бұрын
You're welcome! Heads up - once you have learnt AJAX, I recommend using Fetch 🙂
@nilavdas_32343 жыл бұрын
Can we write the text file ?
@_productivity__nill_11315 жыл бұрын
Good tutorial
@dcode-software5 жыл бұрын
Thanks mate! Glad you liked it
@fahadhafeez80865 жыл бұрын
Access to XMLHttpRequest at 'file:///D:/xampp/htdocs/dom.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, brave, https. My console error!
@pedrosoares72734 жыл бұрын
Very well explained, the most basic of basics. However, my chrome for some reason does not let me acess the files. " Access to XMLHttpRequest at 'file:///C:/XXX/XXXX/XXXXX/XXXX/dom.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https." How to fix this?
@Meleeman0114 жыл бұрын
put the file on a local server such as a node.js server or nginx/apache server. I think node is easiest, you could run a dev server with node server.js and have server.js serve your file to localhost:3333 or whatever port, reference that in your xhr.request and as long and you have your development server running you can locally test without a CORS issue.
@FordExplorer-rm6ew5 жыл бұрын
What are the 2 links at the top? What is KZbin.local? I've tried googling it but nothing's coming up conclusive
Thanks for a great video ! But please help me get rid of this : Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
@dcode-software6 жыл бұрын
Thank you! For that issue, are you using the "file" protocol (reading from the disk directly rather than using a server)?
@faizanmemon49566 жыл бұрын
Can i use localhost using xammp ?
@dcode-software6 жыл бұрын
Yeah! That will be fine - I believe for purposes of security you are unable to access local files using JavaScript, because then any website would be able to read the local files on your computer
@faizanmemon49566 жыл бұрын
Can i use files other than .txt ?
@dcode-software6 жыл бұрын
Definitely, as far as I'm aware you can use whatever file you want, in fact you don't even need a file, as long as you have a HTTP response and some body content, you're OK
@fahadhafeez80865 жыл бұрын
Great!
@rethpark5 жыл бұрын
thank you man....
@souravdeb61265 жыл бұрын
What is the editor, please?
@dcode-software5 жыл бұрын
The editor is Atom
@souravdeb61265 жыл бұрын
I put the question and went out for a walk hoping that when I come back, someone might have put the answer so thank you!!
@sergioa11136 жыл бұрын
gracias! :D
@dcode-software6 жыл бұрын
No worries mate!
@minach695 жыл бұрын
Hi, nice video. I did exactly what you did and I get the below error. What do you think is the issue? mexico.js:29 Access to XMLHttpRequest at 'file:///C:/Users/imedi3/Documents/Web%20Reports/Mexico%20Triggers/prueba.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https. (anonymous) @ mexico.js:29
@dcode-software5 жыл бұрын
Cross-origin. You need to make sure the file you're trying to read is on the same origin (or server) as the origin that the JavaScript is running on
@omar7amdi3 жыл бұрын
Thanks
@domaincontroller4 жыл бұрын
I've installed LAMP. Put the index.html and dom.txt in /var/www/html and removed all my chrome extensions which were creating websocket issues. Everything worked fine then.
@davidtsiklauri80895 жыл бұрын
Perfect :d
@abdulhaqfayeq59622 жыл бұрын
I wrote like this but , did work
@donaldklopper2 жыл бұрын
Clever example :-D there's no web server needed ...
@ZainNaeemOfficialdotcom4 ай бұрын
Great explanation, thanks Dcode You save my time
@glitchdigger2 жыл бұрын
This didn't even remotely work for me. Very odd.
5 жыл бұрын
dude, you need a soft touch keyboard! or move the mic away from the keyboard... LOL thx for the video
@dcode-software5 жыл бұрын
😂😂
@prasannaparthiban70502 жыл бұрын
what is f*****in dada
@mrchedda5 жыл бұрын
I'm trying to finish watching but your pretentious SUPER-DUPER tactile feedback , "I'm a real programmer", keyboard is annoying as $h!t3. You people think you're superior because your keyboard requires a million JOULES to type one letter. Terrible
@dcode-software5 жыл бұрын
Nah mate, I just like the keyboard.
@salexkorsan87902 жыл бұрын
is there any way to get Outside result of the Function xmlhttp.onreadystatechange=function(){ } // i want result here Out side of the Function. trying to solve from two Month please help
@slapmyfunkybass6 жыл бұрын
Firstly thanks for the video. To me though, it seems more logical to put the xhr open and send lines before the function. I have to admit I’ve never seen it done this way. But wouldn’t it make more sense to make the request, send it, then run the function to check all is okay and display? Of course it doesn’t matter as the function can sit anywhere, but in terms of logical programming wouldn’t that way round make more sense?
@titikshaiyer44452 жыл бұрын
Had the same thought
@greatpandas995 жыл бұрын
You're a lifesaver man, I really appreciate this. Thanks