better way to use in AJAX requests? $.POST or $.AJAX? - ajax

I have seen many articles for making ajax requests..
most of them are using $.AJAX for jquery ajax posting and some of them are using $.POST for jquery ajax posting...
I want to know what is the best way if I want to post using ajax? which method makes the ajax request fast and in lightweight?

$.post is a shorthand way of using $.ajax for POST requests, so no difference.
$.ajax is generally better to use if you need some advanced configuration.

$.post is just shorthand for $.ajax({type: 'POST'}). It makes no difference to the speed or weight of the request, just changes the readability of your code.

$.post is just a shorthand for $.ajax({ type: 'POST' }) [see reference], so there is no acceptable performance improvement, but still a readability one.

Related

Does Ajax always require the use of node.js?

I learning about the use of AJAX in web development, and I need to know if AJAX always require the use of node.js, or JQUERY?
Thanks.
That is a very broad question, so the answer might be broad as well:
The short answer: Ajax does not require jQuery nor Node.js.
In practice, Ajax is a technology for asynchronous operations utilized by Javascript send data to and retrieve from a server asynchronously(1). Ajax is fully available in plain, vanilla Javascript, and it works as follows (example taken from Wikipedia, see sources):
// This is the client-side script.
// Initialize the Http request.
var xhr = new XMLHttpRequest();
xhr.open('get', 'send-ajax-data.php');
// Track the state changes of the request.
xhr.onreadystatechange = function() {
var DONE = 4; // readyState 4 means the request is done.
var OK = 200; // status 200 is a successful return.
if (xhr.readyState === DONE) {
if (xhr.status === OK) {
alert(xhr.responseText); // 'This is the returned text.'
} else {
alert('Error: ' + xhr.status); // An error occurred during the request.
}
}
};
// Send the request to send-ajax-data.php
xhr.send(null);
This is a classic example, showing both how to use Ajax with vanilla Javascript, and also why it's much easier with other means such as jQuery, shortening the same snippet to just:
$.ajax({
url: "http://fiddle.jshell.net/favicon.png",
}).done(function(data) {
// Do something with data.
});
Sources (including vanilla Ajax examples):
Wikipedia: Ajax
A Guide to Vanilla Ajax Without jQuery
jQuery: ajax()
There is no need to use node.js to perform an Ajax request. You can make an Ajax request even using vanilla Javascript. However, jQuery made the Ajax request is very easy and cross-browser compatible with just some lines of code. So, I recommend you to stick with jQuery instead of using vanilla Javascript.
You can find more information regarding the jQuery Ajax feature here: http://api.jquery.com/jquery.ajax/
You can also find more information about the vanilla Javascript Ajax request feature here:
http://www.w3schools.com/ajax/
No, most browsers supply means to perform asynchronous javascript requests but libraries such as jQuery partly came about to smooth over the differences between browsers, making ajax a lot more portable.
Modern browsers generally don't have so great differences, so portability is probably is less of an issue, but using libraries has become common practice.

Intercepting jQuery ajax

If I am going to encrypt the data being passed by jQuery ajax prior to sending to the network (regardless if the network is SSL'd or not), where can I inject that functionality?
You can intercept all ajax queries initiated by jQuery, examine their content and change them (encrypt in your case) by using ajax prefilter in jQuery. With is approach you can modify all requests' contents at one place globally.
Details: http://api.jquery.com/jQuery.ajaxPrefilter/
Well, jQuery.ajax has a data field, which corresponds to the data sent in your request. So cleanest would be to set this field as a call to your encoding function.
$.ajax({
...
data: yourDataEncodingFunction(),
...
});
Remember data must be Key/Value pairs, so be sure that's what your function returns.

Synchronous AJAX call

In a scenario, I have written a javascript and in middle of the script I made an AJAX call. There is some more amount of script which is present after the AJAX call and this needs to be executed based on the results returned from the function. But Unfortunately the script which is present after the AJAX call is executed before the function call itself, that is, the call is being made asynchronously. Could anyone please suggest me how to overcome this problem?
Thanks in Advance..
Are you using jQuery? IF not, you should :)
Then you should read this documentation - http://api.jquery.com/jQuery.ajax/
And put the rest of the script in the success handler of the ajax function.
If you still insist on not using jQuery, just use the onreadystatechange function
http://www.w3schools.com/ajax/ajax_xmlhttprequest_onreadystatechange.asp

Is jQuery.ajax and $.ajax the same?

In tutorials can see jQuery.ajax and $.ajax
Like here http://www.thekludge.com/form-auto-save-with-jquery-serialize/
jQuery.ajax({
url: 'my_form.php',
And here http://www.yourinspirationweb.com/en/how-and-when-to-use-jquerys-serialize-method/
$.ajax({
url: 'elaboration.php',
Please advice is jQuery.ajax and $.ajax is the same?
In general they might be not the same.
$ can be used and overwritten by some other library that uses it as a global reference to itself.
According to the jQuery documentation,
a code example on that page is written as:
$.ajax({
url: "test.html",
context: document.body
}).done(function() {
$(this).addClass("done");
});
so yes, they should be the same.
jQuery.ajax and $.ajax are the same thing. The dollar sign is an alias for jQuery functions. In some cases, where other js files are using the dollar sign, it is necessary to use jQuery. Otherwise, the selector is ambiguous and errors will be thrown in the console.
Yes, they are the same. See the docs for details:
http://api.jquery.com/jQuery/
Some libraries such as prototype also use $ for their own purposes. jQuery can be put into noconflict mode to handle situations where you have another library on the same page that also uses $. In that case they would be different things.

Run function on event

im trying to run javascript function when other funcion will stop.
For example: User change something in form and ajax has been sent in background. When ajax request is done i want to run function.
How can i do that ?
Or maybe there is a global trigger for ajax requests ?
You could achive that thanks to ajax asynchronous request and handler. If you, for example, call via ajax a page that do a particular function and then return, you can run your js.
Take a look at this: http://api.jquery.com/ajaxComplete/
You can configure a handler for the ajax request which gets called when you get response for the request. You can check the examples at http://api.jquery.com/jQuery.ajax/
If you want to call a specific function for a specific AJAX call, simply call it as part of the success or complete callbacks on that AJAX call. If, however, you want to call the same function whenever any AJAX request is finished, take a look at the .ajaxSuccess() or .ajaxComplete() methods in the jQuery API.
It looks that you are using jQuery, so you can use the "complete" or "success" settings to call code/function. Check the docs.
$.ajax({
url: "test.html",
success: function(){
// call another function
}
});

Resources