HiveBrain v1.2.0
Get Started
← Back to all entries
patternjavascriptCritical

JavaScript post request like a form submit

Submitted by: @import:stackoverflow-api··
0
Viewed 0 times
formsubmitrequestlikepostjavascript

Problem

I'm trying to direct a browser to a different page. If I wanted a GET request, I might say
document.location.href = 'http://example.com/q=a';


But the resource I'm trying to access won't respond properly unless I use a POST request. If this were not dynamically generated, I might use the HTML





Then I would just submit the form from the DOM.

But really I would like JavaScript code that allows me to say
post_to_url('http://example.com/', {'q':'a'});


What's the best cross browser implementation?

I need a solution that changes the location of the browser, just like submitting a form. If this is possible with XMLHttpRequest, it is not obvious. And this should not be asynchronous, nor use XML, so Ajax is not the answer.

Solution

Dynamically create `s in a form and submit it
/**
* sends a request to the specified url from a form. this will change the window location.
* @param {string} path the path to send the post request to
* @param {object} params the parameters to add to the url
* @param {string} [method=post] the method to use on the form
*/

function post(path, params, method='post') {

// The rest of this code assumes you are not using a library.
// It can be made less verbose if you use one.
const form = document.createElement('form');
form.method = method;
form.action = path;

for (const key in params) {
if (params.hasOwnProperty(key)) {
const hiddenField = document.createElement('input');
hiddenField.type = 'hidden';
hiddenField.name = key;
hiddenField.value = params[key];

form.appendChild(hiddenField);
}
}

document.body.appendChild(form);
form.submit();
}



Example:
post('/contact/', {name: 'Johnny Bravo'});


EDIT: Since this has gotten upvoted so much, I'm guessing people will be copy-pasting this a lot. So I added the
hasOwnProperty` check to fix any inadvertent bugs.

Context

Stack Overflow Q#133925, score: 2390

Revisions (0)

No revisions yet.