const btn = document.querySelector('button');
function sendData( data ) {
console.log( 'Sending data' );
const XHR = new XMLHttpRequest();
let urlEncodedData = "",
urlEncodedDataPairs = [],
name;
// Turn the data object into an array of URL-encoded key/value pairs.
for( name in data ) {
urlEncodedDataPairs.push( encodeURIComponent( name ) + '=' + encodeURIComponent( data[name] ) );
}
// Combine the pairs into a single string and replace all %-encoded spaces to
// the '+' character; matches the behaviour of browser form submissions.
urlEncodedData = urlEncodedDataPairs.join( '&' ).replace( /%20/g, '+' );
// Define what happens on successful data submission
XHR.addEventListener( 'load', function(event) {
alert( 'Yeah! Data sent and response loaded.' );
} );
// Define what happens in case of error
XHR.addEventListener( 'error', function(event) {
alert( 'Oops! Something went wrong.' );
} );
// Set up our request
XHR.open( 'POST', 'https://example.com/cors.php' );
// Add the required HTTP header for form data POST requests
XHR.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
// Finally, send our data.
XHR.send( urlEncodedData );
}
btn.addEventListener( 'click', function() {
sendData( {test:'ok'} );
} )