I have my form set to run a function and this function will change the href to the next page based on the Radio buttons selection. for some reason, the value is not being submitted, and when it does submit it's only coming up as VoIP.
evalportalp1.html:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<form id="myForm" onsubmit="goPThree(event)" method="get">
<div id="pBFContainer">
<div id="bodyFOption1">
<label for="email">Enter email address for service confirmation:<p></label>
<input type='email' id='inputEmail' name='email' minlength="10" size="70" required></input>
</div>
<div id="bodyFOption2">
<label for="testType">Choose the test theme for your evaluation:<p></label>
<input class="optionT" type='radio' name='testType' value='voip' checked>VoIP Readiness<p>
<input class="optionT" type='radio' name='testType' value='bandwidth'>Bandwidth quality, user experience, throughput, and capacity.<br><br>
</div>
</div>
<input type="submit" id="subButton" value="Next..." />
</form>
</body>
<script type="text/javascript" src="evalportalp1.js"></script>
</html>
evalportalp1.js:
var ls = window.location.search;
var qs = new URLSearchParams(ls);
var testType = qs.get("testType");
function goPThree(event) {
event.preventDefault();
switch (testType) {
case "voip":
console.log("testtype is voip");
window.location.href = "evalportalv3.html" + ls;
case "bandwidth":
console.log("testtype is bandwidth");
window.location.href = "evalportalb3.html" + ls;
default:
alert("Please pick a valid Option");
}
return false;
}
You need to get the value of the testType field whenever you submit. Otherwise you would just be reading the value thats currently in the URL.
function goPThree(event) {
event.preventDefault();
const formData = new FormData(event.target);
const testType = formData.get("testType");
switch (testType) {
case "voip":
console.log("testtype is voip");
window.location.href = "evalportalv3.html" + ls;
case "bandwidth":
console.log("testtype is bandwidth");
window.location.href = "evalportalb3.html" + ls;
default:
alert("Please pick a valid Option");
}
return false;
}