Skip to main content

Ajax with Jquery

This time I wanted to write something for Jquery.

Jquery is a very good Javascript library. It reduces much of your coding time.
So here is how you do AJAX with Jquery
Step 1 -: Download the latest version of jquery from
here. This is Jquery 1.4 minified version.
Step 2 -:
$.get(url,'',function(data){
alert("Data from ajax is "+data);
});

Done !!!

Now I will explain it-
1.The "$" is nothing but a shorthand notation for jQuery.

2.Then comes "get" , this can be replaced with post as well, as this is the method by which the http request will be sent to the server.

3.Next is "url". This is the url of the page you are requesting.

4.After url I have the next parameter is left as '' . This parameter is just for adding the parameters (query strings) to the url. It is left to the programmer that he wants to use this parameter or not . You can club your query string in the Url also.

5.Finally we have a callback function which is called after ajax has happend. The "data" is the parameter which the holds the data obtained from the server.

Now finally an Example to understand better-
Let's suppose I have to get the data from the url="http://www.example.com/foo/bar"
and the parameters (query string ) are "car=merz&efficency=80"
so we do ajax as-
$.get("http://www.example.com/foo/bar",{"car:merz","efficency:80"},function(data){
alert(data);
});



OR
the other way around is-
$.get("http://www.example.com/foo/bar?car=merz&efficiency=80",'',function(data){
alert(data);
});

Both are correct.
By Jquery you also do not have to worry about cross browser compatibility. Jquery takes care of that.
Further Jquery has a lot of options for doing ajax . The example here shown is just for learning. You can always refer the jQuery API for further options.

Comments

Popular posts from this blog

Difference between SJAX and AJAX

AJAX is Asynchronous Javascript and XML SJAX is Synchronous Javascript and XML What does Asynchronous means ? It means that when a request is sent to the server the statements following (javascript code OTHER than the callback function ) are executed WITHOUT waiting for the server response. So even though if your server is taking a long time for responsing for a request , you are not put on a hold. That's the beauty of AJAX. Synchronous means here exactly the opposite of it. That means you force the browser to wait for the server response. This might be a bit a dangerous step because if the server takes a long time,the browser may appear dead. Your users might have to close the tab or the browser. How to send Synchronous request by jQuery? $.ajax method of jquery supports a lot of options , there is an option called async which is true by default . You can set it to false. You can find it here

Anchor Text - Extract All of them

This function finds all the href links of a page including their anchor text as well. This function is also capable of finding href links which either have an images or html tags in the text part. I have seen a lot of regular expressions in books and internet ,but they miss out those href links which have images or html tags in them. This gives an array containing the links and their anchor texts . <?php /* $content is an argument which contains the contents of html page in a string. */ function getURLsFromPage($content) { $images=getImageTags($content); foreach($images as $image) { $content=str_replace($image,"",$content); } $anchors=getAnchorText($content); foreach($anchors as $anchor) { $content=str_replace($anchor,strip_tags($anchor),$content); } //get all urls in a page irrespective of their domains... $matches = array(); URL_pattern = "/\s+href\s*=\s*[\"\']?\s*([^\s\"\']+)[\"\'\s]?\s*[^>]*>([^<]*)<\/a>/ims...