Forum Discussion
The fix involved tweaking the javascript on the code page to capture additional fields, you'll see them below as input, input2, input3 etc. What this does is pop up a simple form with 4 questions. 3 are just text questions and one is a 'rating' type question. Here is my code page after my modification, the sections in bold are where I added extra fields:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>QA Checklist</title>
<style>
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #3498db;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
display: block;
margin-left: auto;
margin-right: auto;
}
/* Safari */
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style></head>
<body>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> </script>
<script>
function run() {
$('#form').hide();
$('#status').show();
const input = document.getElementById('input').value;
const input2 = document.getElementById('input2').value;
const input3 = document.getElementById('input3').value;
const input4 = document.getElementById('input4').value;
let urlParams = new URLSearchParams(window.location.search);
let url = urlParams.get('url') + encodeURIComponent(input) +
`&_fid_1415=` + encodeURIComponent(input2) +
`&_fid_1417=` + encodeURIComponent(input3) +
`&_fid_1419=` + encodeURIComponent(input4);
let redirect = urlParams.get('redirect');
let landing;
if(redirect){
landing = redirect;
}else{
landing = document.referrer;
}
fetch(url, {
method: 'post',
mode: 'no-cors',
headers: { 'Content-type': 'text/plain' }
}).then((response) => {
rdr(landing);
})
}
function rdr(landing){
// Redirects to the specified landing page, if this page is the landing page as well, then redirect to the app home page
if(landing && landing !== window.location.href) {
window.location.href = landing;
}else{
window.location.href = window.location.origin + window.location.pathname;
}
}
</script>
<div class="container" id="form">
<h2>QA Checklist</h2>
<form onsubmit="run();">
<div class="form-group" style="width: 300px;">
<label for="input">1. Please answer this question.</label>
<input class="form-control" id="input" autofocus="">
<label for="input2">2. Please answer this question.</label>
<input class="form-control" id="input2" autofocus="">
<label for="input3">3. Please answer this question.</label>
<input class="form-control" id="input3" autofocus="">
<label for="input4">4. Please answer this question.</label>
<input class="form-control" list="datalistOptions" id="input4" placeholder="Choose a rating" autofocus="">
<datalist id="datalistOptions">
<option value=1>
<option value=2>
<option value=3>
<option value=4>
<option value=5>
</datalist>
</div>
<a class="btn btn-primary" onclick="run()" role="button">Submit</a> <a
class="btn" onclick="window.location.href = document.referrer;" role="button">Cancel</a>
</form>
</div>
<div class="container" id="status" style="text-align:center" hidden="">
<h2>Saving your answers, will redirect once complete.</h2>
<div class="loader" id="loader"></div>
</div>
<br>
</body>
</html>
------------------------------
Jeff Peterson
------------------------------