In this video we will work with the load, $.get, $.post and $.ajax methods in jQuery My 10 Project jQuery/JS Course - www.eduonix.co... Project Files - github.com/bra...
Hi Brad, great series, I will definitely recommend this to anyone that needs to learn jQuery quick. A quick note for anyone that gets stuck in the beginning of this video with the error "Uncaught ReferenceError: $ is not defined", make sure that you are loading jQuery from the cdn and not locally. node is looking for the file in 127.0.0.1 and not your directory. If you follow instructions on part 1 of this series correctly, you won't run into this issue.
This is the best guide on the subject I've seen. Why do other people explain it with so much abstraction? It's almost like they don't want you to know how ajax works
I have watched some other popular JQuery courses, yours is the best at least for me. I am definitely going to check out your 10 project course. Thanks for the awesome channel.
you just cleared out confusion i had which was bugging me for a long time. you have a remarkable attitude which is very rare in this profession, unfortunately. thanks.
Appreciate for your great help. I am an entry level learner for the full stack development. I was stuck at how to send the data from back end to front end or front end to back end. Your jquery series really help me to solve this problem. I am willing to donate!
Thank you for this jQuery tutorial series Brad. This complements my Javascript Class well and watched all 5 videos which are easy to follow in one day.
I don't think you can use "this" anymore inside of the $(), it always returns undefined. You have to put in the id/class passed into the first $(). In effect, you do: $('#postForm').submit(e => { e.preventDefault(); let title = $('#title').val(); let body = $('#body').val(); let url = $('#postForm').attr('action'); $.post(url, { title, body }).done(data => { console.log(data); }); });
1. Install Nodejs 00:00 2. Setting up on the computer npm (Window) 01:20 3. Working on the command prompt for live-server 02:35 4. What does AJAX mean ? 03:35 5. Creating the first AJAX script with load(test.html) method 04:08 6. IMPORTANT PROCEDURE: Load() method with a Callback function, in order to check if it is working well AJAX -load() 05:47 7. Get Method another alternative for loading data as a HTML file 08:03 8. IMPORTANT PROCEDURE Get Method Working with JSON data 08:49 9. IMPORTANT PROCEDURE: Working with a URL with AJAX (it is not a local file) 11:20 10. IMPORTANT PROCEDURE: A remote JSON data put away in HMTL format 13:27 11. IMPORTANT PROCEDURE A POST requesting , which is working with a FORM in HTML 14:45 12. IMPORTANT PROCEDURE : Post Requesting codinng
Questions: @13:34 I noticed the website where you AJAX from is in JSON objects, but after you retrieved and console.log that it becomes JS objects, does AJAX automatically do that? I thought you have to JSON.parse(data) before you can access it with JS. Another question: @ 14:51 When you add post.title and post.body, you didnt concatenate a line break , how does it know to add the tag to the next line? Thank you so much in advance. I'm new to jQuery, much appreciated if you could help me out.
Hi Brad. Very good stuff anyway. @5:49 you added the callback function for the load task. I wonder where do you get the documentation for the function you passed to? How do I know what are the possible params fort that one? Thanks for the hard work you made on TH-cam.
Hello Sir this is Muhammad Yousaf actually i am not well in the Jquery so if you dont mind upload more JQuery Tutorials which help us ...... thanks for these Tutorials
I think you could send the data using jQuery via regular POST request. From there you could use PHP $_POST superglobal to handle your data. Make sure you sanitize it before submitting it to your DB.
Can we use $.ajax() like this to connect to another API instead of jsonplaceholder and get around the "CORS header 'Access-Control-Allow-Origin' missing" or does that require a different approach? Are there videos on that?
I'm using AJAX with the GET method from an API to get info, is it possible to save a specific "post.title" (using the example shown in the video) value to a DB using php? For instance, get the information and afterwards select the first post and save the title of the first post in my DB? If so, how can i do this?
You need to make a request on the API. Just like the post example of the video. On the API side or your own side you should have the db related and do whatever you want to do with the payload of your request.
Hmmm I can't get the getJSON method to work. And I'm having the same problem with the ajax method. They both actually get the json files (they show on the console) but they are not rendered as li elements into the html file. No idea why...
I suggest you to look at the previous videos if you are still lacking the knowledge regarding basics. Because from what it seems you didn't understand the objects. You should look for either Javascript videos or google object oriented programming to get a more senseful information.
in linux, go to usb using file manager and right click and then go to terminal, that would open the terminal in that directory. else in windows, using file manager go to flash drive folder, and then on the path in upper side of the window, where file directories are written, click it and it will select all, then at the beginning type "cd" with the file path, that would open the terminal. for ios, I don't know, I'm not well financed.
I can't get the live-server working. Any ideas? I'm on a mac and I tried 3 different ways to install. npm install live-server, npm install -g live-server, and sudo npm install -g live-server. I'm getting an error: zsh: command not found: live-server.
I got an error from VS Code: "Live Reload is not possible without body or head tag". I didn't do the cmd line live-server because I'm using the Live Server extension. Do you think that is the cause for the error and should I ignore it?
man, im trying to do it with just nodejs server, without npm lite-server because xubuntu doesnt support it. Then, load('test.html') is not working right, because $('#result').load('test.html'); is puting the index.html file into the instead of the test.html, and i don know why Y.Y help please!
thnx alot for this amazing playlist . but , i have a Q here Brad used the parameter (i) several times but I didnt get the use of it , can anybody help ?
![jQuery Crash Course [1] - Intro & Selectors](http://i.ytimg.com/vi/3nrLc_JOF7k/mqdefault.jpg)
![อยู่คนเดียวกับเขา - ส้ม มารี (Zom Marie) [Official MV]](http://i.ytimg.com/vi/gq1cWAIQDLg/mqdefault.jpg)
Yet years later, it is gold.. Thank you Brad.
AJAX with JQuery - this is the simplest video i have ever seen... thank you!
Hi Brad, great series, I will definitely recommend this to anyone that needs to learn jQuery quick. A quick note for anyone that gets stuck in the beginning of this video with the error "Uncaught ReferenceError: $ is not defined", make sure that you are loading jQuery from the cdn and not locally. node is looking for the file in 127.0.0.1 and not your directory. If you follow instructions on part 1 of this series correctly, you won't run into this issue.
Thanks! :)
I always thought Jquery was hard because of some weird selector stuff until I came across this resource. Thanks, Brad it has been awesome!!!
This is the best guide on the subject I've seen. Why do other people explain it with so much abstraction? It's almost like they don't want you to know how ajax works
Just finished the playlist.
Thank u, kind sir.
Dude, you are awesome. I had to learn jQuery by myself (it was a task of self-study) and you made it easy as chips in the ninja. Thank you!
wow man. this is dope. i dont need to do codecademy on jquery anymore lmao
I have watched some other popular JQuery courses, yours is the best at least for me. I am definitely going to check out your 10 project course. Thanks for the awesome channel.
Thank you sir :)
@@TraversyMedia No Thankyou sir
@@real_anil9688 You tell 'em
you just cleared out confusion i had which was bugging me for a long time. you have a remarkable attitude which is very rare in this profession, unfortunately. thanks.
Ofcourse traversy media has a jquery ajax course, bro you are a legendario legend!
Appreciate for your great help. I am an entry level learner for the full stack development. I was stuck at how to send the data from back end to front end or front end to back end. Your jquery series really help me to solve this problem. I am willing to donate!
Thank you for this jQuery tutorial series Brad. This complements my Javascript Class well and watched all 5 videos which are easy to follow in one day.
I subscribed long before I finished the first couple parts of this tutorial. Thank you, Brad.
As always, great videos Brad. Greatly appreciated. Thanks
I don't think you can use "this" anymore inside of the $(), it always returns undefined. You have to put in the id/class passed into the first $().
In effect, you do:
$('#postForm').submit(e => {
e.preventDefault();
let title = $('#title').val();
let body = $('#body').val();
let url = $('#postForm').attr('action');
$.post(url, { title, body }).done(data => {
console.log(data);
});
});
Thanks, I wondered why it didn't work for me - this made it work
Thank You!!! The best explanation I have had till now!
finished the playlist, thank you brad!❤
الحمدلله تم الانتهاء 💜
thanks for the playlist... long live Brad Traversy !!
1. Install Nodejs 00:00
2. Setting up on the computer npm (Window) 01:20
3. Working on the command prompt for live-server 02:35
4. What does AJAX mean ? 03:35
5. Creating the first AJAX script with load(test.html) method 04:08
6. IMPORTANT PROCEDURE: Load() method with a Callback function, in order to check if it is working well AJAX -load() 05:47
7. Get Method another alternative for loading data as a HTML file 08:03
8. IMPORTANT PROCEDURE Get Method Working with JSON data 08:49
9. IMPORTANT PROCEDURE: Working with a URL with AJAX (it is not a local file) 11:20
10. IMPORTANT PROCEDURE: A remote JSON data put away in HMTL format 13:27
11. IMPORTANT PROCEDURE A POST requesting , which is working with a FORM in HTML 14:45
12. IMPORTANT PROCEDURE : Post Requesting codinng
Willing to donate
your hard work still used in 2020 lockdown thank you
All your videos are absolutely awesome!!!
Very easy to follow and understand! Great work!
Amazing Course Thank you for your great explination
thank you brad! I have completed full playlist
watching 2021. Thank yu Brad
This tutorial was very useful. Thanks for making such cool crash courses.
I'll be purchasing your 10 project course mate. This is fantastic work, thanks.
Thank you sir. Im glad you liked it. Thanks for watching
Very nice explanation. Thanks for it.
Omg, you are really awesome. Thank you for what you are doing, really!
thank you very much brad ill try and get u more students to eduonix and youtube as well.....
Very Good Course Good luck
Your vids are always dope!
Love from Pakistan. Thank you alot.
Thank you!
Is there a course where you explain the ajax functions in more detail?
Thanks for this new course
nice of way of teaching....thanks
this is simply awesome ... superb
Thankyou again...Completed the series
If you are facing the problem of installing server, this is the new command....> npm install -g liver-server
Really helpful video, thanks
I am amazed at this great course thx bro
Thank You!! Very much for all video..
You're welcome :)
Amazing teaching , thanks.
Questions: @13:34 I noticed the website where you AJAX from is in JSON objects, but after you retrieved and console.log that it becomes JS objects, does AJAX automatically do that? I thought you have to JSON.parse(data) before you can access it with JS.
Another question: @ 14:51 When you add post.title and post.body, you didnt concatenate a line break , how does it know to add the tag to the next line?
Thank you so much in advance. I'm new to jQuery, much appreciated if you could help me out.
Thanks for wonderull content!
Hi Brad. Very good stuff anyway. @5:49 you added the callback function for the load task. I wonder where do you get the documentation for the function you passed to? How do I know what are the possible params fort that one? Thanks for the hard work you made on TH-cam.
OK ;-) as simple as: api.jquery.com/load/
thanks for video ❤❤❤I like it so much . it's pretty awesome )))))
Very fine. Many thanks!
Hello Sir this is Muhammad Yousaf actually i am not well in the Jquery so if you dont mind upload more JQuery Tutorials which help us ...... thanks for these Tutorials
Thank you very much for your hard work!
pre/&,?mier69
*How to submit data(received through form) to database(php myadmin) using jQuery?*
You can't, you have to use a backend language to communicate with the DB.
I think you could send the data using jQuery via regular POST request. From there you could use PHP $_POST superglobal to handle your data. Make sure you sanitize it before submitting it to your DB.
Thank you so much
Thanks for this course
Thanks for this :)
Thank you! :)
Do you think you can make a course on Jquery Ajax with PHP, Validating form stuff like that?
great, but beginners have no idea what are parameters like data, i, user.... be more specific please
are these jquery videos still good 2020 or not? because the explanation so easy ... thanks
very nice tutorial
thank you very much .
great
Thanks!!! :)
Can we use $.ajax() like this to connect to another API instead of jsonplaceholder and get around the "CORS header 'Access-Control-Allow-Origin' missing" or does that require a different approach? Are there videos on that?
I'm using AJAX with the GET method from an API to get info, is it possible to save a specific "post.title" (using the example shown in the video) value to a DB using php? For instance, get the information and afterwards select the first post and save the title of the first post in my DB? If so, how can i do this?
You need to make a request on the API. Just like the post example of the video. On the API side or your own side you should have the db related and do whatever you want to do with the payload of your request.
dopeeeeeeeeeeee thank u so much bro
this is so interesting
very helpful vidoes .....do they cover the whole jQuery library?
No but you know enough now to digest almost anything in the Docs bro imo
How can you learn and remember everything 😮😮😮😮
Why I can't access your Elearning Video in my mobile phone. It shows icon only
12:13 i think 'method' should be 'type', eh ? Great vid. btw
Hmmm I can't get the getJSON method to work. And I'm having the same problem with the ajax method. They both actually get the json files (they show on the console) but they are not rendered as li elements into the html file. No idea why...
Could fix the getJSON changing my json file, I was using single quotes. The ajax method now is rendering undefined on title and body.... :(
I think I know what you mean but still nothing, could you paste your snippet here please? Much appreciated
I suggest you to look at the previous videos if you are still lacking the knowledge regarding basics. Because from what it seems you didn't understand the objects. You should look for either Javascript videos or google object oriented programming to get a more senseful information.
What if I installed nodejs on my USB and saved the files (html files) on USB too, how do I open them in cmd ?help me please
in linux, go to usb using file manager and right click and then go to terminal, that would open the terminal in that directory.
else in windows, using file manager go to flash drive folder, and then on the path in upper side of the window, where file directories are written, click it and it will select all, then at the beginning type "cd" with the file path, that would open the terminal.
for ios, I don't know, I'm not well financed.
does responseTxt and xhr has to be placed in that order to work, or they can be placed any where as the parameter?
what if I'd like to host such webpage using some hosting service? Is it safe to assume that the AJAX functionality will just work?
Hi Brad u r awesome. Can you make TH-cam search engine app
I can't get the live-server working. Any ideas? I'm on a mac and I tried 3 different ways to install. npm install live-server, npm install -g live-server, and sudo npm install -g live-server. I'm getting an error: zsh: command not found: live-server.
I got an error from VS Code: "Live Reload is not possible without body or head tag". I didn't do the cmd line live-server because I'm using the Live Server extension. Do you think that is the cause for the error and should I ignore it?
Npm: node package manager
How do you know what to write into the function parameters??
Write less, do more indeed.
man, im trying to do it with just nodejs server, without npm lite-server because xubuntu doesnt support it. Then, load('test.html') is not working right, because $('#result').load('test.html'); is puting the index.html file into the instead of the test.html, and i don know why Y.Y help please!
Is ( async -await and Promises ) an alternative to this?
I can barely follow along, it looks like there are no rules to how objects are passed around
Is this crash course still relevant since it's 3 years old
at the end im getting eror 405: method not allowed.. any help?
How to set up nodejs server on XAMPP?
you want to set up a server on a server?
Simple registration form without page reload on clicking submit button plz
i don't consider windows a valid server medium, due to its many security flaws.
Dude that noise in background. Hopefully by this year you have either better mic or noise gate enabled. So freaking annoying noise.
JQuery still relevant today in 2020?
yes, preferably old applications still use it
thnx alot for this amazing playlist . but , i have a Q here
Brad used the parameter (i) several times but I didnt get the use of it , can anybody help ?
it is the index for the loop api.jquery.com/each/
is this still relevant?
your tutorial is 4.5star. if audio is excellent it would be 5star
Create jquery scroll animation video
Took me awhile to realize that you completely skipped over including jquery, nothing important i guess