jQuery Ajax get() and post() Methods

Hello guys!

Welcome to our series of jQuery’s .

In our previous segment we saw things related with ajax, ajax send that is executed before sending a request, and ajax error is executed when there is error with response to request.

These are two such very important methods. I hope the practicals we did related to both the methods, u would have practiced.them.Moving forward in today’s session.

Our today’s session is on ajax get and post methods. Previously we saw ajax's load method, there in the syntax of loading, only requesting it inside the parentheses.

Means where our request should go we wrote the name of that file. And firstly, the very first example of ajax that we saw, we used jQuery dot ajax method.

And inside the ajax method, we passed url , type, data type, acing, success etc etc. Means by passing parameters the function was performed.

In today’s topic of get and post, I will first cover get. So like get is, get and post both are our ajax method.

But like ajax this get and post are “used to request data from a server with an HTTP GET or POST request”. Means with the help of https get and post methods we will call our ajax.

And what are the names of ajax call methods, get and post. So in http to use get method, in our jQuery’s ajax’s get method, in to use http’s post method, in jQuery ajax’s  post method.

I hope this is clear, both have the same name. So what “get does is, request data from a specified resource. Meaning I am sending requests from any source.

In our example we made a program named demo, that we have on our server. My server Apache has already started. So here I will write about the local host jQuery. You can see all the programs that we have generated in our directory.

Here when we saw the example of load, saw example of load with call back, saw example of ajax error and send. In every case we saw, we called this file named demo dot html.

So here the request is being sent from load ajax error, load ajax send files, to whom to this demo dot html file. So now come to the slide, what slide says, requests data from a specified resource.

So what will be our specified resource, this demo dot html file. So we are getting the file demo dot html from our server. So here we are sending requests, because we only have to send requests using the get method.

Yes, we through our request, there, the file on the server, means inside this demo file, we are not doing any changes.  We simply send a request and in response to it we get a file.

We are doing this much only. If we get a scenario, from here we have to do any change that will make changes in the file that is on the server. So what we will do in that case.

In that case we will use this post. What post method does?” Post method submits data to be processed to a sub specified resource”. Meaning if I am sending data, and I want that it will make changes in that file too, then I will use the post method.

But I only want to get, I only want to, I don't want to make any change in the file that is at the server. I just need to get data from there. So I will use get.

But if I want to make changes in the file there, so what I will use, I will use post. So here “GET is basically used for just getting (retrieving) some data from the server”. OK “The GET method may return cached data”.

This is a note that whatever is there in our cached data that also can be retrieved. “POST can also be used to get some data” OK.

But “the POST method NEVER caches data, and is often used to send data along with the request”. Means if I am only to send requests, so I will use get and can also use post.

But if I request, I need to send some data, to update on the server, to update the file that is on the server, then I will use the post method.

First one is the dollar dot get method, what I explained is that only. This method “requests data from the server with an HTTP GET request.

It is a simple method, in it we will just write dollar dot… get . From where we want the data, we have to specify a url. Like in our case we will write the name of our demo file.

And in the callback we will write the function that after the request gets executed what we will do? In the example here, simple, it is a bit different. Here we have created an ASP file, and whatever data is in the ASP file we are receiving that data.

So what we will do for the ASP file, so let’s say I  open the sublime text. Here is my ASP written, let’s take html ASP as of now. And I placed this file inside it, like this is its syntax.

You don’t take tension with what this ASP is, we will have to learn ASP. Don’t worry, you simply can use dot html file as well. I just only for the purpose of giving an example using this ASP file.

Here it is its syntax, we like after eight that less than, percentage we write. So the response dot …write, “this is… some text from… an external ASP file”.

We have kept a statement here that indicates we got data from an external ASP file. We will save it, we will save it on our server only. And let’s say I give it a name req, this is our html ASP, so demo, demo.

Request demo. OK this is our file name. Now whatever task we are doing will happen only in our simple html file. Because we now have made the ASP file from where we have to get the data.

Now we have to make our html file through which we will…do our request. So here html, example dollar dot get, simple every time the library… we add we will add that.

Will write script…, dollar dot document ready…. and down here… style, body, …text align centre. And since it is our get program so here inside H one example dollar dot get. Basically over the button click only we are going to execute our dollar dot get.

So let’s say here I place a button , button, click…. id button. So my call will be on this button. Here will come after the hashtag…, button dot click function.

So here we will write whatever we are to execute. So this program of ours is of ajax call basically, here after button click we will do our get method call. So let’s say dollar dot “get, what we saw in our syntax it is the same thing.

We request this.. request…demo dot ASP file. So it will go something like request demo dot html, name to be very careful of. ASP comma, whatever I have to make over successful execution.

So on successful execution I want this function to get executed. Here will come my data, that I have got in response and what is data’s status. So I will do an alert, first of all data plus data and in a new line whatever is the status.

So here buy doing plus, status. Like we did the get method, made this ASP function, we will call it, whatever data we will get will show in data. Whatever will come in status will show in status.

That’s it will save the program, it’s name, the name of the method actually is dollar dot get. So here I will simply write “get.  Now I reload it on the server only, you can see my get.

And the request demo came, when I run the request demo, it’s showing this error because it is not a html file. It is an ASP file.

So let’s say  I run get and click here so you can see I am not getting any response. So with F twelve I will check what is the error? “Responded with a status of five hundred internal “error”. Means I am not getting a response there is some problem.

So let’s say, the name of the file that is request demo, in place of it I simply do it html…. OK. Let’s check once what its name is... Demo dot html.

OK, save, …click. So you can see here, that my file, that complete file I have got here. Because in data, data with H two tags and data with P one tag I have received.

I repeat it again. My file has come complete. If I have to show it in a portion, in the html portion. So I here after get, I mean in that case I would use the load method.

Because where will load  give me the replaced data,  where I have passed the id. You can see my ASP part won’t work here. Here I will have to use my html part because I am using it from the server.

So here my example of GET gets completed. How? I did GET over the button click, I named the file in GET from where I am sending the request. On its success I executed the function.

And I am getting success in func status. I again remove this nine point two. Save it, and reload it, click it. You can see I am not getting the file. Because now I am getting an error of four zero four not found.

So in that case GET is not getting successful, my alert box is not working. Let's do it as it was. Click, successful and my data is coming. So this is our ajax’s get method. 

Now comes our ajax’s POST method. This is our ajax’s post method. Here in POST our syntax is exactly like GET. What does the “post'' method basically do? Post method is used when we send data to the server.

Here are two tasks one data goes to the server, if we along with the data, means with the request have attached some data. So whatever program of ours is at the server, if it can handle the request. So it will update it’s data through that data.

But if we haven’t sent any data, the same as get method, whatever url in the request we have sent post method will also return us the data.

Means what we did in the get method exactly the same task will be done through the post method. But one additional thing is if we have sent any data along with the request. And we want the data to update it in our file that is on the server, that will happen.

We haven’t sent any data, and no such logic is written there in file at the server, that you update this file. So that task won’t be performed. Data updation will not be done. Simple, on request data will be returned to us.

So for the post we will make a simple program as of now. We won’t cover the ASP part, because it is not running on the server. So to run ASP, you have to go into your programs, which means control panel, programs, turn on non feature programmes and inside that have to enable internet information services.

And ideally the ASP file has its own technique through which it runs. So that we won’t cover in our ajax part. So we simply, I will simply show you a post method program. In the post method only how we have to update the file, sorry how to perform “get request, we will show that.

So let’s say, our get part, I write the same as get part inside dollar I write post. Now inside post what I am doing, inside post simply the file I requested “from get. I am requesting the same file through post.

So if I save this program, C…., zam, inside http docs jQuery, inside it by the name post….

So what happens, this file of ours isn’t saved properly. OK. Now our file is saved by the name post. So my file got “post, saved. Now I will go to my server, this is my server, where I will scroll, I now see my post file.

I run it, what we did in get if I do the same in post, what am I getting? Exactly the same output I am getting. Means the file, demo dot html that I requested, I am getting the complete data of that in the data part and in status I am getting success.

Means, my file if I request success, any data, through post method, it gets returned to me. If I am to update some of my data that is on the server, how will I do that with post?

So here, the name of the file that we have written here after that after this comma we have written the function. So in between these two OK, so in between file name and function, we here, we here will write an object.

This object will hold anything that we want to pass, meaning if we want to update anything on the server. So let’s say if I pass a name Joel, what is my name comma… last name… OK….

First name. So I have passed an object with first name and last name, make sure you pass it as object only. Here I have passed an object. Now if I save this program and load then also I will get my expected output.

Because we have passed data through post, but the program we have, that is nine point two demo dot html. This one. We didn’t write any such logic in it.How will it handle data?

How to accept the data when it’s coming? Where to show it and etc etc. Inside this file we have only kept H two and a ‘p’ tag. But it is a demo for you, that if you have any such file on the server, that can update data.

Or is written in such a language like PHP to update the data. Then, if your file at server is written in PHP, asp dot net, so it will update the data and show it. But currently in our case we are sending requests through jQuery.

And is handling its response. But we cannot update the file that is there, that is on the server, that is why through this program I will only teach you how to only get and how to send data through post. So you can send data by placing objects here in the middle portion.

If you have a program on a server in PHP, definitely can update its data through this. So this was our today’s segment in which we learnt the get and post method of ajax.

How can we request data through get and how can we request data through post. And how can we send data through post to get it updated.

So in today's segment we finished the get and post method. Along with this our ajax module too gets finished. I hope whatever we learned through this complete ajax module, and the practicals of get and post that we did today.

You have practised them. I request, practice today’s practicals. If you face any difficulty while practising today’s practicals, or there is a point in today’s segment that you didn’t understand. So you can tell that to us on “FORUMS.LEARNVERN.COM”. Discussion to be added.

We will revert all your questions with solutions.

Will meet in our next module that is our, upon jQuery’s selectors.

So see you in the next segment guys.

Thank you.