Lear how to make Ajax Call in jQuery


Ajax Call in jQuery

var selected_type = 2;
   type: "GET",
   url: "/api/getData",
   data: { type: '1'},
   success: function (data) {   
     if (data.Success) {
       $('#types_dropdown').append('Select Type');
       $.each(data.Items, function (i, val) {
          $('#types_dropdown').append('' + val.text + '');
       if (selected_type != null && selected_type != '') {
          $('#types_dropdown').val(selected_type );
   error: function (xhr, textStatus, errorMessage) {
     $('p').append('Error: ' + errorMessage); 
   complete: function () { } 


The ajax() method is used to perform an AJAX or asynchronous HTTP request

Parameter :
type: A type of http request e.g. POST, PUT and GET. Default is GET.
type: ‘POST’, // http post method

url: A string URL to which you want to submit or retrieve the data

data: A data to be sent to the server. It can be JSON object, string or array.

success A callback function to be executed when Ajax request succeeds.
error: A callback function to be executed when the request fails
complete: A callback function to be executed when request finishes.


Other Optional Parameter that can be used in different situations

dataType: The type of data that you’re expecting back from the server
dataType: ‘json’,

contentType: A string containing a type of content when sending MIME content to the server.Default is “application/x-www-form-urlencoded; charset=UTF-8

headers: An object of additional header key/value pairs to send along with request.

accepts: The content type sent in the request header that tells the server what kind of response it will accept in return.

timeout: A number value in milliseconds for the request timeout.
timeout: 1000, // timeout milliseconds


Points to Remember :
— $.ajax() method allows you to send asynchronous http requests to submit or retrieve data from the server without reloading the whole page.

— $.ajax() can be used to send http GET, POST, PUT, DELETE etc. request. It can retrieve any type of response from the server.


More on jQuery …

How useful was this post?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

Be the first to comment

Leave a Reply

Your email address will not be published.


three × 3 =