I have a form that has two input fileds, I want the value entered in the first page to be available when redirected to another route?
I have an '/instances' route which renders an 'instances' view, this 'instances' view has two input text which ids are 'Instances' and 'Region' and a button id = 'runScriptButton' that has onclick = "launchTerraform()"
once the button is clicked it executes the launchTerraform() and redirects the user to the '/dashboard' route, in this route there is a button as well with id = 'destroyButton'. in this '/dashboard' route, I would like to have access to the input values entered by the user in the '/instances' page.
Here is what I have tried so far, but It does not work, once on '/dashboard', 'data' is not accessible.
function launchTerraform() {
// this is the data I would like to be able access from /dashboard route
var data = {
instances: document.getElementById('Instances').value,
region: document.getElementById('Region').value
}
if (document.getElementById('runScriptButton') ){
var xhr = new window.XMLHttpRequest()
xhr.onreadystatechange = function () {
if (this.readyState === 4 && this.status === 200 ) {
window.location.href = '/dashboard'
}
}
document.getElementById("test").textContent = "Please wait ...";
xhr.open('POST', '/provision', true)
xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8')
xhr.send(JSON.stringify(data))
}
if (document.getElementById('destroyButton')){
var xhr = new window.XMLHttpRequest()
xhr.onreadystatechange = function () {
if (this.readyState === 4 && this.status === 200 ) {
document.getElementById("divDestoyResources").textContent = "Resources Deleted"
}
}
document.getElementById("divDestoyResources").textContent = "Please wait while resources are released ...";
xhr.open('POST', '/destroy', true)
xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8')
xhr.send(JSON.stringify(storeData))
}
}