Last active
December 16, 2015 07:49
-
-
Save prettycode/5401705 to your computer and use it in GitHub Desktop.
Use this function to submit an HTML form without actually having a form on the page. Instead of an existing form, pass the function a *flat* JavaScript object with the form values to submit. This is a synchronous operation; the browser loads the response as its new window location. Requests with "Content-Type: application/x-www-form-urlencoded".
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var submitForm = function(config) { | |
if (!config) { | |
throw new Error(); | |
} | |
else { | |
config.method = config.method || 'post'; | |
config.data = config.data || {}; | |
config.url = config.url || (function() { | |
throw new Error('Missing required `url` argument'); | |
})(); | |
} | |
this.createElement = function(tag, attrs) { | |
var el = document.createElement(tag); | |
Object.keys(attrs).forEach(function(key) { | |
el.setAttribute(key, attrs[key]); | |
}); | |
return el; | |
}; | |
var form = this.createElement('form', { | |
method: config.method, | |
action: config.url | |
}); | |
function add(name, value) { | |
if (typeof value === 'undefined') { | |
return; | |
} | |
else if (value === null) { | |
value = 'null'; | |
} | |
form.appendChild(this.createElement('input', { | |
type: 'hidden', | |
value: value, | |
name: name | |
})); | |
} | |
Object.keys(config.data).forEach(function (key) { | |
var value = config.data[key]; | |
if (Array.isArray(value)) { | |
value.forEach(function (v) { | |
add(key, v); | |
}); | |
} | |
else if (Object.prototype.toString.call(value) === '[object Object]') { | |
throw new TypeError('`data` members cannot be objects.'); | |
} | |
else { | |
add(key, value); | |
} | |
}); | |
form.submit(); | |
}; | |
var url = 'http://www.google.com'; | |
// Request body: datetime=1365811679443&guids=C20H32O2&guids=C43H66N1 | |
submitForm({ | |
url: url, | |
data: { | |
datetime: Date.now(), | |
guids: [ | |
'C20H32O2', | |
'C43H66N1' | |
] | |
} | |
}); | |
// Request body: 0=C20H32O2&1=false&3=null&4=Fri+Apr+12+2013+17%3A21%3A33+GMT-0700+%28Pacific+Daylight+Time%29&5=1 | |
submitForm({ | |
url: url, | |
data: [ | |
'C20H32O2', | |
false, | |
undefined, | |
null, | |
new Date(), | |
1 | |
] | |
}); | |
// Empty request body | |
submitForm({ | |
url: url, | |
data: {} | |
}); | |
// Empty request body | |
submitForm({ | |
url: url | |
}); | |
// intentionally throws TypeError | |
submitForm({ | |
url: url, | |
data: { | |
winner: { | |
id: 0 | |
} | |
} | |
}); | |
// intentionally throws Error | |
submitForm({ | |
url: undefined, | |
data: { | |
custId: 0 | |
} | |
}); | |
// intentionally throws Error | |
submitForm(undefined); | |
// GET http://www.google.com/?datetime=1366211074394&guids=C20H32O2&guids=C43H66N1 with no request body | |
submitForm({ | |
url: url, | |
method: 'get', | |
data: { | |
datetime: Date.now(), | |
guids: [ | |
'C20H32O2', | |
'C43H66N1' | |
] | |
} | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment