Search

Calling API tips with AJAX and server side - Real time time attendance data

Updated: Jan 16


You can make requests to COACH APIs in Postman. An API request allows you to retrieve data from a data source, or to send data. APIs run on web servers, and expose endpoints to support the operations client applications use to provide their functionality. You can download the API client here.


Another alternative is to make calls to the server to fetch some data. In this article, we will see how to implement a simple API call using AJAX from the client side.


// Get the token first

var token = '';

$("#btnToken").click(function () {

$.ajax({

url: "https://apiurl.puumsoft.co.th/token",

method: "POST",

headers: { "Content-Type": "application/x-www-form-urlencoded" },

data: { grant_type: "client_credentials", client_id: "id", client_secret: "secret" },

success: function (result) {

token = result.token_type + " " + result.access_token;

$("#txtToken").val(result.access_token);

}

});

});


// Get data

$("#btnGetData").click(function () {

$.ajax({

url: "https://apiurl.puumsoft.co.th/view?name=hrview",

method: "GET",

headers: { "Authorization": "bearer " + $("#txtToken").val() },

success: function (result) {

// Play with your result here

}

});


// Post timestamp data

var t = {

timeAttendanceCode: "20132921",

terminalMatchCode: "",

stampType: "I",

stampDate: $("#txtDate").val(),

stampTime: $("#txtTime").val(),

latitude: 0,

longitude: 0,

locationName: $("#txtLocation").val()

};


var body = [];

body.push(t);


$.ajax({

url: url+"/TimeAttendance/TimeStamp",

method: "PUT",

headers: {

"Authorization": "bearer " + $("#txtToken").val(),

"Content-Type": "application/json"

},

data: JSON.stringify(body)+":",

success: function (result) {

// Play with your result here

}

});


Another alternative is from the server side calling APIs. Download the sample code below.

APICode
.zip
Download ZIP • 1KB

132 views0 comments