ajax mdn
var formData = {name:"John", surname:"Doe", age:"31"}; //Array
$.ajax({
url : "https://example.com/rest/getData", // Url of backend (can be python, php, etc..)
type: "POST", // data type (can be get, post, put, delete)
data : formData, // data in json format
async : false, // enable or disable async (optional, but suggested as false if you need to populate data afterwards)
success: function(response, textStatus, jqXHR) {
console.log(response);
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(jqXHR);
console.log(textStatus);
console.log(errorThrown);
}
});
<button id="ajaxButton" type="button">Make a request</button>
<script>
(function() {
var httpRequest;
document.getElementById("ajaxButton").addEventListener('click', makeRequest);
function makeRequest() {
httpRequest = new XMLHttpRequest();
if (!httpRequest) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
httpRequest.onreadystatechange = alertContents;
httpRequest.open('GET', 'test.html');
httpRequest.send();
}
function alertContents() {
if (httpRequest.readyState === XMLHttpRequest.DONE) {
if (httpRequest.status === 200) {
alert(httpRequest.responseText);
} else {
alert('There was a problem with the request.');
}
}
}
})();
</script>