Reading JSON with jQuery

แชร์
ฝัง
  • เผยแพร่เมื่อ 12 พ.ย. 2024

ความคิดเห็น • 110

  • @dominik1023
    @dominik1023 9 ปีที่แล้ว +1

    This was the most amazing, simple and comprehensive tutorial I've ever seen! You took the time to explain what's what in the functions and worked your way from simple to more complex. Finally, a good programming teacher!! Thank you sir.

  • @ikponmwosaomoruyi4959
    @ikponmwosaomoruyi4959 8 ปีที่แล้ว

    Spent almost 3 days on something then watched this video and was done in less than 30mins. A really helpful video. Thanks man....

  • @tminus3
    @tminus3 8 ปีที่แล้ว +20

    This was the best explanation on the internet! Period! Thank you so much!

    • @szappan_9093
      @szappan_9093 8 ปีที่แล้ว +2

      +Abhi Visuvasam Totally agree!

  • @bsky1998
    @bsky1998 7 ปีที่แล้ว +1

    I searched and searched for ages and couldn't understand how it all worked and you taught me! Now I can consume the EIA and other API's easily, Thank you!

  • @MuhamedAKura
    @MuhamedAKura 5 ปีที่แล้ว

    3 hours searching google for a solution. Finally i find it here a solution as simple as 3 lines of code. Thanks a lot

  • @mq3945
    @mq3945 7 ปีที่แล้ว +1

    I was stuck with JSON data not showing correctly in the DOM, this helped me a lot. Thank you.

  • @maiarafigueredo8253
    @maiarafigueredo8253 4 ปีที่แล้ว

    The best video explaining ajax. I have been trying for days. only now I got it. Great channel!!

  • @talibali166
    @talibali166 5 ปีที่แล้ว

    This is the best video, It did what my professor and stack over flow couldn't do.
    Sir you have got your self a subscriber

  • @raajnadar
    @raajnadar 7 ปีที่แล้ว +1

    Very easy to understand tutorial...I liked the way you explain stuff in a clean and professional manner

  • @alexmoiseev5442
    @alexmoiseev5442 6 ปีที่แล้ว +1

    Finally! Thank You! - the best explanation out there on how to access data from json file using html and jQuery!

  • @lgtv1203
    @lgtv1203 8 ปีที่แล้ว

    Thanks! Spent hours searching for a solution. Very helpful!

  • @SteveParadisDesign
    @SteveParadisDesign 6 ปีที่แล้ว +1

    I agree, been struggling with that for a while but you made it super clear! thanks a lot

  • @elminster2371
    @elminster2371 8 ปีที่แล้ว

    You have talent for explaining this material. Keep up the good work!

  • @redking90
    @redking90 8 ปีที่แล้ว

    All day looking for the solution and it was here! Thanks a lot!

  • @unknownpersonofnointerest2743
    @unknownpersonofnointerest2743 7 ปีที่แล้ว +1

    Thanks for your clear speaking and well organized tutorial. Great video!

  • @timothyvanhee3328
    @timothyvanhee3328 7 ปีที่แล้ว +1

    thanks for explaining what my teacher can't

  • @viplav76
    @viplav76 7 ปีที่แล้ว

    I get the following data, encapsulated inside the callback function, test in OpenWeather. How do I access it?
    test({"coord":{"lon":106.85,"lat":-6.21},"weather":[{"id":500,"main":"Rain","description":"light rain","icon":"10d"}],"base":"stations","main":{"temp":28.61,"pressure":1008,"humidity":88,"temp_min":25,"temp_max":32},"visibility":5000,"wind":{"speed":3.1,"deg":360},"clouds":{"all":75},"dt":1508135400,"sys":{"type":1,"id":8038,"message":0.0079,"country":"ID","sunrise":1508106650,"sunset":1508150727},"id":1642911,"name":"Jakarta","cod":200})

  • @trithucnguyen3098
    @trithucnguyen3098 7 ปีที่แล้ว +1

    Helpful tutorial and your voice is very warm sir!

  • @michaelappiah-kubi2829
    @michaelappiah-kubi2829 6 ปีที่แล้ว

    Why can't every tutorial be like this. Glad i found this, thanks a lot!

  • @MB-zj3er
    @MB-zj3er 6 ปีที่แล้ว

    Just the hint to output the result to console.log to reveal the structure of the returned object was worth watching. Thanks great tip for a novice!

  • @mamba6886
    @mamba6886 4 ปีที่แล้ว

    Thanks a lot!!!
    Great voice and you taught great too!

  • @scoppyeah
    @scoppyeah 5 ปีที่แล้ว

    So beautifully and simply explained! AMAZING! Thank you

  • @JustLookA7
    @JustLookA7 7 ปีที่แล้ว +1

    Excellent, now I understand it. In both methods. Thanks!

  • @debomitrasinha5803
    @debomitrasinha5803 9 ปีที่แล้ว

    Awesome!! best way to learn basic jQuery

  • @BarakaMahili
    @BarakaMahili 8 ปีที่แล้ว

    You mentioned that Ajax provides more control, can you demonstrate that? Because, they both seems to work the same way...I will be glad if you can demonstrate the additional controls you get when choosing to use Ajax. Thanks

  • @Djronlove3000
    @Djronlove3000 7 ปีที่แล้ว +1

    Great tutorial. Well explained. Easy to follow.

  • @AttilaTheDev
    @AttilaTheDev 9 ปีที่แล้ว

    This is all lovely, but what do you do if the object contains arrays too...?

  • @michielevargas2559
    @michielevargas2559 5 ปีที่แล้ว

    Great video. Explained so nicely with a simple example. Thank you!

  • @nlplx
    @nlplx 10 ปีที่แล้ว +11

    Thanks a lot! It helps so much!

    • @codecourse
      @codecourse  10 ปีที่แล้ว +4

      Good to hear!

  • @k.7126
    @k.7126 6 ปีที่แล้ว +1

    Thank you.
    How do you read JSON that is structured my month and day?

  • @PSLESAHRING
    @PSLESAHRING 8 ปีที่แล้ว +2

    very clear--------ONE STEp at A TiMe

  • @Mitch_Yang
    @Mitch_Yang 5 ปีที่แล้ว +3

    I keep getting this error. :( Can anyone help?
    "from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https."

    • @JuanGarcia-vf9pe
      @JuanGarcia-vf9pe 4 ปีที่แล้ว

      Hi! have you got any solution for this error? Im stucked in the same. Thanks

    • @toddryan4338
      @toddryan4338 4 ปีที่แล้ว

      So it appears this is due to the Chrome browser perhaps. Didn't look into it too far, but when it happened to me, I just used a JSON file that is hosted on a server. You can use PostMan if you're using API's regularly. They also provide 50+ live API sets that you can use without a key. For instance "api.zippopotam.us/us/98121" is for postal codes. Hope this helps!

    • @itmesneha
      @itmesneha 4 ปีที่แล้ว

      @@JuanGarcia-vf9pe you need to start the chrome.exe file (which will be located somewhere in your program/google/chrome folder in windows most probably) from the command prompt with --allow-file-access-from-files

  • @lobster272
    @lobster272 8 ปีที่แล้ว +1

    This isn't working for me. I just have a simple console log to print out a string and i'm not getting anything. The file seems to be there under the network tab but getJSON just doesn't work. Using jquery 1.10.0.

  • @andredehaan9006
    @andredehaan9006 6 ปีที่แล้ว +1

    Very , very helpful, easy to understand

  • @AC-mi8vf
    @AC-mi8vf 9 ปีที่แล้ว

    great video.. really helped.. but you're using the json in the same directory,, what if the file was in another folder.. can you still use this method? tx...

  • @vipinsaini3497
    @vipinsaini3497 10 ปีที่แล้ว

    Hello,
    I have one question??
    I have a form with having 200 fields so how to validate this form with jquery/javascript?? we can not use
    var fs=document.getElementbyId('firstname');
    for each field??
    So how to validate it??

  • @CydenAcres
    @CydenAcres 6 ปีที่แล้ว

    "Failed to load file:///C:/Project/data/hosts.json: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https." I never got off the starting line :(

  • @lawviktor7610
    @lawviktor7610 7 ปีที่แล้ว +1

    Problems is Fixed! Thank you for this wonderful tutorial! Very straight to the point and very simple which is just fine for a very freshman in AJAX like me ^^;

    • @gutterboy4730
      @gutterboy4730 6 ปีที่แล้ว

      How'd you fix the error? I'm getting the same one.

    • @abc-ze4jk
      @abc-ze4jk 6 ปีที่แล้ว

      try it again on Firefox.

  • @AllenAndersonTaylor
    @AllenAndersonTaylor 4 ปีที่แล้ว

    Thank you for this.

  • @racket1111
    @racket1111 6 ปีที่แล้ว

    This is really informative, but I get a 'Failed to load file://' error in the console with either. Any idea what I need to fix?

  • @2000gunshot
    @2000gunshot 2 ปีที่แล้ว

    Amazing tutorial, keep it up!

  • @brianvanvlymenpaws
    @brianvanvlymenpaws 8 ปีที่แล้ว

    thank you for excellent I was struggling part I did not realized we can to put inside $(data.example).each. thank you.

  • @ProlixeServer
    @ProlixeServer 7 ปีที่แล้ว +3

    Hello, il have error in console :
    XMLHttpRequest cannot load file:///F:/formation/controle%20continu%203/continu3%20v2/questions.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

    • @ProlixeServer
      @ProlixeServer 7 ปีที่แล้ว +1

      OK en local c'est de la merde, il faut mettre les fichier sur un hébergeur et là ça fonctionne ;)

  • @andrewgpayne3
    @andrewgpayne3 5 ปีที่แล้ว

    Any idea how to fix this error???
    jquery-3.4.1.min.js:2 Access to XMLHttpRequest at 'file:///C:/Users.........Dict.json' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

  • @makedaevilmage
    @makedaevilmage 8 ปีที่แล้ว

    Thanks for the tut. This was exactly what i needed to know for our schoolproject ;) I need to use an API that outputs the data in JSON format. I've seem to get the hang of it now :D

  • @x_czt
    @x_czt 3 ปีที่แล้ว

    Good Explanation...

  • @tutorialwithjhon4951
    @tutorialwithjhon4951 8 ปีที่แล้ว

    you're my saviour as usual :)

  • @ViddeshG
    @ViddeshG 8 ปีที่แล้ว

    You are too good! Thanks this helped a lot...

  • @SiddhantParkar
    @SiddhantParkar 8 ปีที่แล้ว

    Awesome video! Made concepts crystal clear. Do we compulsorily need to run this on a server?

  • @jackdelar
    @jackdelar 10 ปีที่แล้ว

    Hi Alex! Thank you for posting this video! Your tutorials have always helped me a lot! I was just wondering how would you output each JSON Object to a div in HTML? say for example inside that div, with the title of the article inside a tag and the body in a tag. Thanks!

    • @welovephp
      @welovephp 10 ปีที่แล้ว +2

      Instead of console.log() you would say for example, $('h3').text(value.title). Same thing for the . This is if your doing it like in this tutorial. Note that looping will cause only the last values to appear inside your tags.

  • @lawviktor7610
    @lawviktor7610 7 ปีที่แล้ว

    Problem appeared~~~...
    jquery-2.1.4.min.js:4 XMLHttpRequest cannot load file:///C:/phpStudy/WWW/catch%20it/theJason.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
    what should i do with this error on my computer?
    Thank you for your help~~

  • @jeromericohermoso1115
    @jeromericohermoso1115 4 ปีที่แล้ว

    This is great!

  • @MrRomemarce
    @MrRomemarce 7 ปีที่แล้ว +1

    Hi, Thanks you are the best!!, Buen trabajo amigo

  • @tahirfeyzioglu
    @tahirfeyzioglu 4 ปีที่แล้ว

    thanks alot for array name articles example. All of example; basic json. Thanks.

  • @johndeoresearch2251
    @johndeoresearch2251 6 ปีที่แล้ว

    how to output to html? thanks

  • @fazzeurwhite
    @fazzeurwhite 4 ปีที่แล้ว

    you are a good man !

  • @JoelRemix
    @JoelRemix 10 ปีที่แล้ว

    Always enjoyed your videos.
    One thing I always wish you did but never wanted to bother you with it.
    I'll take a second to bother you with it it now though and maybe others will benefit as well.
    Please capture your videos into a smaller resolution desktop. Watching your videos on the iPad can sometimes be hard and on the iPhone is definitely harder to see.
    Thanks for all the videos

  • @conck
    @conck 10 ปีที่แล้ว

    This doesn't seem to work when pulling a JSON file from an external (HTTP) server. Any advice?

    • @dimonmalta
      @dimonmalta 10 ปีที่แล้ว

      you would need to use JSONP

  • @t160
    @t160 10 ปีที่แล้ว

    Dude great video!

  • @delduked
    @delduked 7 ปีที่แล้ว

    OH EHM GEE my code is now WORKING FOR ME!!

  • @biotechpro8209
    @biotechpro8209 8 ปีที่แล้ว

    data.articles give return nothing, please help

  • @samyyoussef8380
    @samyyoussef8380 5 ปีที่แล้ว +2

    i tried the code till 3:51 it gives errors saying:
    Uncaught ReferenceError: $ is not defined
    would anyone help??

    • @blameyourm8519
      @blameyourm8519 4 ปีที่แล้ว

      in HTML include JQUREY library

  • @KareemShobier
    @KareemShobier 5 ปีที่แล้ว

    Thanks a lot

  • @joshambush5591
    @joshambush5591 6 ปีที่แล้ว

    This helped me a lot! thanks : )

  • @joaoquintanilha7292
    @joaoquintanilha7292 7 ปีที่แล้ว

    Hello sir,
    Whenever i'm trying to load a file this way, I get this error:
    XMLHttpRequest cannot load file:/// MYPATH.jason Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
    I dont know how to fix this. Do you know how to help me?

    • @esra_1218
      @esra_1218 3 ปีที่แล้ว

      @Miles Falk How can I solved It ?!

  • @mralextacy
    @mralextacy 10 ปีที่แล้ว

    awesome, thanks!

  • @TaiebBACCOUCH
    @TaiebBACCOUCH 10 ปีที่แล้ว

    Nice tutorial. Thanks

  • @ВиталийПугач-к8ю
    @ВиталийПугач-к8ю 9 ปีที่แล้ว

    thanks for your job

  • @clapynick
    @clapynick 8 ปีที่แล้ว

    Great tutorial!

  • @FozeverGA
    @FozeverGA 7 ปีที่แล้ว +1

    NIce video, i dont understand very good english but i could undesrtand u man thx

  • @nadeenmetanishareb2627
    @nadeenmetanishareb2627 7 ปีที่แล้ว

    heey, can you please help me!
    how can i insert this data into a table in html?

    • @bsky1998
      @bsky1998 7 ปีที่แล้ว

      Remove this line, the json data will display on this line through the div class.
      $( ".US" ).append(value.data[0][1]);
      I had a multidimensional array so you can skip on the [0] and [1] if not needed.
      You just have to use append.

  • @riyaadhfakier8537
    @riyaadhfakier8537 8 ปีที่แล้ว

    Very good... you got subscribed

  • @waelluay6902
    @waelluay6902 8 ปีที่แล้ว

    thank you so much, really helped

  • @bharathn5918
    @bharathn5918 7 ปีที่แล้ว +1

    thanks lot

  • @cassioglayful
    @cassioglayful 5 ปีที่แล้ว

    Hey, thanks! 😉

  • @danialarshad7272
    @danialarshad7272 7 ปีที่แล้ว +1

    Thankyou

  • @georgigeorgiev2219
    @georgigeorgiev2219 9 ปีที่แล้ว

    Thank you very much for this tutorial.
    GOD bless you and keep you :).

  • @penson3782
    @penson3782 8 ปีที่แล้ว

    it's useful for me!

  • @saidurrahman2202
    @saidurrahman2202 10 ปีที่แล้ว

    tnx for uploading this video

  • @quybui4628
    @quybui4628 9 ปีที่แล้ว

    great!!!

  • @renzogf1103
    @renzogf1103 7 ปีที่แล้ว

    Muchas gracias, me ayudaste demasiado amigo (Y)

  • @ahmadaziz1800
    @ahmadaziz1800 9 ปีที่แล้ว

    thanks alot :)

  • @stak_95
    @stak_95 3 ปีที่แล้ว

    I love you

  • @eotikurac
    @eotikurac 9 ปีที่แล้ว

    4:10 i can't do this in chrome locally. chrome is stupid.

  • @jasonreviews
    @jasonreviews 8 ปีที่แล้ว +1

    you can't do this anymore you need live server to do this.

    • @DxBlack
      @DxBlack 8 ปีที่แล้ว

      +Jason Chan I literally just did this in my browser and it works as long as the file is local.

  • @_productivity__nill_1131
    @_productivity__nill_1131 5 ปีที่แล้ว

    This tutorial won't work unless you're using XAMPP

  • @sushil893
    @sushil893 3 ปีที่แล้ว

    Cors error

    • @sushil893
      @sushil893 3 ปีที่แล้ว

      Please help

  • @Osmanylmaz8098
    @Osmanylmaz8098 3 ปีที่แล้ว +1

    osman

    • @Osmanylmaz8098
      @Osmanylmaz8098 3 ปีที่แล้ว

      Ddupfkkgkpc
      kh.bkicşgchvcjgjgvjmrjnvkkşhvkv+bkg

  • @thek1llerbear570
    @thek1llerbear570 6 ปีที่แล้ว

    Who here wants to learn this to get better at minecraft commands probably none of you . you probably have more important uses for it

  • @CameronCashwell
    @CameronCashwell 7 ปีที่แล้ว

    "day-tuh"

  • @kornelijekovac9793
    @kornelijekovac9793 8 ปีที่แล้ว

    Lame trash...