Это видео недоступно.
Сожалеем об этом.

Reading JSON with jQuery

Поделиться
HTML-код
  • Опубликовано: 22 фев 2014
  • Want more? Explore the library at www.codecourse...
    Official site
    www.codecourse...
    Twitter
    / teamcodecourse

Комментарии • 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.

  • @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!

  • @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....

  • @MuhamedAKura
    @MuhamedAKura 4 года назад

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

  • @alexmoiseev5442
    @alexmoiseev5442 6 лет назад +1

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

  • @mq3945
    @mq3945 7 лет назад +1

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

  • @raajnadar
    @raajnadar 7 лет назад +1

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

  • @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

  • @unknownpersonofnointerest2743
    @unknownpersonofnointerest2743 7 лет назад +1

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

  • @SteveParadisDesign
    @SteveParadisDesign 6 лет назад +1

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

  • @lgtv1203
    @lgtv1203 8 лет назад

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

  • @Mitch_Yang
    @Mitch_Yang 4 года назад +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 3 года назад

      @@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

  • @redking90
    @redking90 8 лет назад

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

  • @trithucnguyen3098
    @trithucnguyen3098 7 лет назад +1

    Helpful tutorial and your voice is very warm sir!

  • @elminster2371
    @elminster2371 8 лет назад

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

  • @timothyvanhee3328
    @timothyvanhee3328 6 лет назад +1

    thanks for explaining what my teacher can't

  • @JustLookA7
    @JustLookA7 6 лет назад +1

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

  • @MB-zj3er
    @MB-zj3er 5 лет назад

    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!

  • @nlplx
    @nlplx 9 лет назад +11

    Thanks a lot! It helps so much!

  • @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.

  • @michaelappiah-kubi2829
    @michaelappiah-kubi2829 6 лет назад

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

  • @scoppyeah
    @scoppyeah 5 лет назад

    So beautifully and simply explained! AMAZING! Thank you

  • @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.

  • @viplav76
    @viplav76 6 лет назад

    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})

  • @michielevargas2559
    @michielevargas2559 5 лет назад

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

  • @Djronlove3000
    @Djronlove3000 6 лет назад +1

    Great tutorial. Well explained. Easy to follow.

  • @k.7126
    @k.7126 6 лет назад +1

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

  • @tahirfeyzioglu
    @tahirfeyzioglu 4 года назад

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

  • @debomitrasinha5803
    @debomitrasinha5803 8 лет назад

    Awesome!! best way to learn basic jQuery

  • @mamba6886
    @mamba6886 4 года назад

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

  • @andredehaan9006
    @andredehaan9006 6 лет назад +1

    Very , very helpful, easy to understand

  • @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 ;)

  • @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.

  • @2000gunshot
    @2000gunshot 2 года назад

    Amazing tutorial, keep it up!

  • @PSLESAHRING
    @PSLESAHRING 8 лет назад +2

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

  • @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

  • @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??

  • @MrRomemarce
    @MrRomemarce 6 лет назад +1

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

  • @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 :(

  • @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

  • @samyyoussef8380
    @samyyoussef8380 4 года назад +2

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

  • @SiddhantParkar
    @SiddhantParkar 7 лет назад

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

  • @x_czt
    @x_czt 3 года назад

    Good Explanation...

  • @AllenAndersonTaylor
    @AllenAndersonTaylor 4 года назад

    Thank you for this.

  • @andrewgpayne3
    @andrewgpayne3 4 года назад

    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.

  • @FozeverGA
    @FozeverGA 7 лет назад +1

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

  • @AttilaTheDev
    @AttilaTheDev 9 лет назад

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

  • @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

  • @jeromericohermoso1115
    @jeromericohermoso1115 4 года назад

    This is great!

  • @AC-mi8vf
    @AC-mi8vf 8 лет назад

    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...

  • @fazzeurwhite
    @fazzeurwhite 3 года назад

    you are a good man !

  • @ViddeshG
    @ViddeshG 8 лет назад

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

  • @racket1111
    @racket1111 5 лет назад

    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?

  • @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~~

  • @georgigeorgiev2219
    @georgigeorgiev2219 8 лет назад

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

  • @tutorialwithjhon4951
    @tutorialwithjhon4951 8 лет назад

    you're my saviour as usual :)

  • @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.

  • @KareemShobier
    @KareemShobier 5 лет назад

    Thanks a lot

  • @joshambush5591
    @joshambush5591 5 лет назад

    This helped me a lot! thanks : )

  • @bharathn5918
    @bharathn5918 7 лет назад +1

    thanks lot

  • @t160
    @t160 10 лет назад

    Dude great video!

  • @delduked
    @delduked 6 лет назад

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

  • @TaiebBACCOUCH
    @TaiebBACCOUCH 10 лет назад

    Nice tutorial. Thanks

  • @waelluay6902
    @waelluay6902 8 лет назад

    thank you so much, really helped

  • @danialarshad7272
    @danialarshad7272 7 лет назад +1

    Thankyou

  • @user-sg4kw8uh3m
    @user-sg4kw8uh3m 8 лет назад

    thanks for your job

  • @mralextacy
    @mralextacy 10 лет назад

    awesome, thanks!

  • @riyaadhfakier8537
    @riyaadhfakier8537 8 лет назад

    Very good... you got subscribed

  • @clapynick
    @clapynick 8 лет назад

    Great tutorial!

  • @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

  • @biotechpro8209
    @biotechpro8209 7 лет назад

    data.articles give return nothing, please help

  • @saidurrahman2202
    @saidurrahman2202 10 лет назад

    tnx for uploading this video

  • @johndeoresearch2251
    @johndeoresearch2251 5 лет назад

    how to output to html? thanks

  • @cassioglayful
    @cassioglayful 5 лет назад

    Hey, 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 ?!

  • @penson3782
    @penson3782 8 лет назад

    it's useful for me!

  • @renzogf1103
    @renzogf1103 6 лет назад

    Muchas gracias, me ayudaste demasiado amigo (Y)

  • @stak_95
    @stak_95 3 года назад

    I love you

  • @quybui4628
    @quybui4628 9 лет назад

    great!!!

  • @ahmadaziz1800
    @ahmadaziz1800 8 лет назад

    thanks alot :)

  • @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.

  • @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.

  • @eotikurac
    @eotikurac 8 лет назад

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

  • @sushil893
    @sushil893 3 года назад

    Cors error

  • @Osmanylmaz8098
    @Osmanylmaz8098 3 года назад +1

    osman

    • @Osmanylmaz8098
      @Osmanylmaz8098 3 года назад

      Ddupfkkgkpc
      kh.bkicşgchvcjgjgvjmrjnvkkşhvkv+bkg

  • @_productivity__nill_1131
    @_productivity__nill_1131 5 лет назад

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

  • @CameronCashwell
    @CameronCashwell 7 лет назад

    "day-tuh"

  • @thek1llerbear570
    @thek1llerbear570 5 лет назад

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

  • @kornelijekovac9793
    @kornelijekovac9793 8 лет назад

    Lame trash...