In this article, we will discuss how to invoke API using the AJAX call. We use the ajax call because it allows the user to Update a Web page without reloading the page, Request data from a server – after the page has loaded, Receive data from a server – after the page has loaded, Send the data to a Server – in the background.

 

Below HTTP verb used to call particular web API call. Here is the mapping sequence:
  • POST: Create
  • GET: Read
  • PUT: Update
  • DELETE: delete
So, the idea is that when we perform a create operation we must use the POST verb with respect to the RESTful service and in this article, we will use the jQuery ajax() function for the post operation.
Here is the simple example for send data in API.
var person = new Object();  
person.name = $('#name').val();  
person.surname = $('#surname').val();  
$.ajax({  
    url: 'http://localhost:3413/api/person',  
    type: 'POST',  
    dataType: 'json',  
    data: person,  
    success: function (data, textStatus, xhr) {  
        console.log(data);  
    },  
    error: function (xhr, textStatus, errorThrown) {  
        console.log('Error in Operation');  
    }  
});

 

In the above code, we pass the person data to the API using the Post method.