getButterfly
Resume

NAVIGATION

ATTRIBUTION

getButterfly
Dublin, Ireland

All Content Copyright ©2018
getButterfly

Same-Origin AJAX Request Using Vanilla JavaScript

This JavaScript function will send an AJAX request – GET or POST – with no third-party dependencies:

function soQuery(soMethod, soUri) {
    var xhttp = new XMLHttpRequest();

    xhttp.open(soMethod, soUri, true);

    if (soMethod === 'GET') {
        xhttp.send();
    } else if (soMethod === 'POST') {
        xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
        xhttp.onload = function () {
            // do something to response
            console.log(this.responseText);
        };
        xhttp.send('param1=param1value&param2=param2value&param3=param3value');
    }
}

// Usage
soQuery('GET', 'https://www.example.com/query.php');

Note that the URL should be on the same domain as the function caller.

Find more JavaScript tutorials, code snippets and samples here or more jQuery tutorials, code snippets and samples here.


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.


My Battle Tested Recommendations

Jetpack
Dreamhost
WordPress.com
CodeCanyon
SEMrush

Disclaimer: These recommendations contain affiliate links.