Skip to content

Instantly share code, notes, and snippets.

@AlekVolsk
Created March 15, 2021 18:45
Show Gist options
  • Save AlekVolsk/da7e5a2bd7562434a61092006c90936a to your computer and use it in GitHub Desktop.
Save AlekVolsk/da7e5a2bd7562434a61092006c90936a to your computer and use it in GitHub Desktop.
Ajax query function in native js using jquery syntax
function ajax ({ // объект(!)
url, // url
type = 'GET', // *GET|POST
data = {}, // document.getElementById('formId') | FormData obj | serialized string | json | {}
dataType = 'json', // output format: *'json' | 'html' | 'formData' (FormData obj, return json from the backend!)
contentType = null, // Content-Type header string
before = () => {},
success = (response) => {},
error = (response, status) => {},
after = () => {}
}) {
// before event
if (typeof (before) == 'function') {
before();
}
// data processing
let formData;
if (data instanceof FormData) {
formData = data;
} else {
if (data.nodeName === 'FORM') {
formData = new FormData(data);
} else {
formData = new FormData();
if (typeof (data) == 'string') {
try {
data = JSON.parse(data);
} catch (e) {
data = unserialize(data);
}
}
if (typeof (data) == 'object') {
for ( let key in data ) {
formData.append(key, data[key]);
}
}
}
}
// worker
let response = null;
let request = new XMLHttpRequest();
request.onreadystatechange = function () {
if (this.readyState === 4) {
if (this.status === 200) {
try {
// success event
response = this.response;
if (typeof (success) == 'function') {
switch (dataType) {
case 'json':
response = JSON.parse(this.response);
break;
case 'formData':
let formResponse = JSON.parse(this.response);
response = new FormData();
for ( let key in formResponse ) {
response.append(key, formResponse[key]);
}
break;
default:
}
success(response);
}
} catch (e) {
response = null;
console.error('AJAX():', e);
}
} else {
// error event
console.error('AJAX(): ' + this.status + ' ' + this.statusText);
if (typeof (error) == 'function') {
error(this.response, this.status);
}
}
// after event
if (typeof (after) == 'function') {
after();
}
}
};
// send
request.open(type, url);
request.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
if (contentType) {
request.setRequestHeader('Content-Type', contentType);
}
request.send(formData);
}
function unserialize(s) {
a = s.split('&');
out = {};
for (let k in a) {
let b = a[k].split('=');
out[b[0]] = decodeURIComponent(b[1]) ?? '';
}
return out;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment