In this article, we will cover the most basic methods used in jQuery when dealing with Ajax related methods.
Ajax Methods
The methods listed in the following table are common jQuery Ajax methods that require much less code than standard Ajax.
HTML Example
We will use the following HTML for the examples listed below.
;load() Method
The load() method loads data from the server and places the returned HTML into the matched element. This is one of the most common methods used. The load() method also allows you to retrieve a portion of the content from the target URL.
For example, when this statement, $(’#result’).load(‘ajax/test.html #container’); is executed, it retrieves the content of ajax/test.html, but then jQuery parses the returned document to find the element with an ID of container.
This element, with its contents, is inserted into the element with an ID of result, and the rest of the retrieved document is discarded.
Syntax
$(selector).load(url,data,callback);
$("#go").click(function () { $("#div1").load(‘demo_jquery_ajax_load.txt’); });
get() Method
The get() method is used to perform an AJAX HTTP GET request.
$(selector).get(url,data,success(data,textStatus,jqXHR),dataType);
$("#go").click(function () { $.get(“demo_jquery_ajax_load.txt”, function (result) { $("#div1").html(result); }); });
getScript() Method
The getScript() method is used to get and execute a JavaScript using an AJAX HTTP GET request.
$(selector).getScript(url,success(script, textStatus, jqXHR));
$("#go").click(function () { $.getScript(“demo_jquery_ajax_getScript.js”); });
post() Method
The post() method is used to perform an AJAX HTTP POST request.
$(selector).post(url,data,success(data,textStatus,jqXHR),dataType);
$(“input”).keyup(function () { var txt = $(“input”).val(); $.post(“jquery_ajax_gethint.aspx”, { strinput: txt }, function (data) { $(“span”).html(data); }); });