Redirect code page that show the new record
Hello.
I have a button to add a new record and then redirect to a code page.
I am trying to show the new record on the code page return(Page id 179) .
much appreciated the support on my code page that I am not sure what I'm missing to show the record after redirect.
url field
var text urlToExecute = URLRoot() & "db/" & Dbid() & "?a=API_AddRecord"
& "&_fid_11=" // Field to Popuplate with the user prompted input
;
var text redirect =
URLRoot() & "db/" & AppID() & "?a=dbpage&pageid=179" // Open code page 4
& "&url="& URLEncode($urlToExecute) // Pass in the URL to execute
PAGE ID 179
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>School Meals Track System</title>
<script src= 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
<link rel='stylesheet' href= 'https://www.w3schools.com/w3css/4/w3.css'>
<link rel='stylesheet' href= 'https://fonts.googleapis.com/css?family=Raleway'>
<link rel='stylesheet' href= 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
<style>
body,h1,h2,h3,h4,h5,h6 {font-family: 'Raleway', sans-serif}
body, html {
height: 100%;
line-height: 1.8;
}
/* Full height image header */
.bgimg-1 {
background-position: center;
background-size: cover;
background-image: url(' https://nextsteppcs.quickbase.com/up/bpc9zk5b6/g/rd3g/eh/va/blackboard-books-apple-school-nutrition.jpg');
min-height: 100%;
</style>
</head>
<body>
<p></p>
<h1 class='bgimg-1 w3-display-container w3-grayscale-min' id='home'>
<div class='w3-display-left w3-text-white' style='padding:48px'>
<h1>School Meals Track System</h1>
<span class='w3-jumbo w3-hide-small'>Hello TNS Student <span id='myDIV'></span>!</span><br><br>
</style>
</head>
<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>
<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;
let urlParams = new URLSearchParams(window.location.search);
let url = urlParams.get('url') + encodeURIComponent(input);
let redirect = urlParams.get('redirect');
let landing;
console.log("input" + input);
console.log("redirect" + redirect);;
console.log("document.referrer" + document.referrer);
console.log("window.location.href " + window.location.href )
console.log("URL" + url)
if(redirect){
landing = redirect;
}else{
landing = document.referrer;
}
fetch(url, {
method: 'post',
mode: 'no-cors',
headers: { 'Content-type': 'text/plain' },
})
.then((response) => {
console.log("RESPONSESTATUS " + response.status);
console.log("RESPONSE STATUSTEXT" + response.text());
console.log("RESPONSEredirected " +response.redirected);
console.log("RESPONSEheaders" +response.headers);
console.log("RESPONSEbody" + response.body);
console.log("landing " + landing);
rdr();
}).catch(err => {
console.log('Request Failed', err);
rdrfail();
});
}
function xmlrun(){
const input = document.getElementById('input').value;
let urlParams = new URLSearchParams(window.location.search);
let url = urlParams.get('url') + encodeURIComponent(input);
console.log(url)
let xhr = new XMLHttpRequest();
xhr.open('POST', url);
xhr.setRequestHeader('Content-Type', 'text/plain' );
xhr.send();
xhr.onload = function() {
if (xhr.status != 200) { // analyze HTTP status of the response
alert(`Error ${xhr.status}: ${xhr.statusText}`); // e.g. 404: Not Found
} else { // show the result
console.log('Done, got ${xhr.response.length} bytes'); // response is the server response
}
};
xhr.onprogress = function(event) {
if (event.lengthComputable) {
//alert(`Received ${event.loaded} of ${event.total} bytes`);
console.log('Received ${event.loaded} of ${event.total} bytes');
} else {
//alert(`Received ${event.loaded} bytes`); // no Content-Length
console.log('Received ${event.loaded} of ${event.total} bytes');
};
rdr()
};
xhr.onerror = function() {
alert("Request failed");
};
}
function rdr(){
console.log("Success redirecting to " + window.location.href );
window.location.href = window.location.href ;
}
function rdrfail(){
console.log("Fail redirecting to " + window.location.href );
window.location.href = window.location.href ;
}
function status(res) {
if (!res.ok) {
throw new Error(res.statusText);
}
return res;
}
</script>
<div class="container" id="form">
<h2></h2>
<form onSubmit="xmlrun();return false">
<div class="form-group">
<label for="input">Please scan the student id</label>
<input class="form-control" id="input" autofocus>
</div>
</form>
</div>
<div class="container" id="status" style="text-align:center" hidden>
<h2>Making API Calls, will redirect once complete.</h2>
<div class="loader" id="loader"></div></div>
<br>
</body>
</html>
<!--
<form onSubmit="run();">
------------------------------
Data System Analyst (Administrator)
------------------------------
I have a button to add a new record and then redirect to a code page.
I am trying to show the new record on the code page return(Page id 179) .
much appreciated the support on my code page that I am not sure what I'm missing to show the record after redirect.
url field
var text urlToExecute = URLRoot() & "db/" & Dbid() & "?a=API_AddRecord"
& "&_fid_11=" // Field to Popuplate with the user prompted input
;
var text redirect =
URLRoot() & "db/" & AppID() & "?a=dbpage&pageid=179" // Open code page 4
& "&url="& URLEncode($urlToExecute) // Pass in the URL to execute
PAGE ID 179
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>School Meals Track System</title>
<script src= 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
<link rel='stylesheet' href= 'https://www.w3schools.com/w3css/4/w3.css'>
<link rel='stylesheet' href= 'https://fonts.googleapis.com/css?family=Raleway'>
<link rel='stylesheet' href= 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
<style>
body,h1,h2,h3,h4,h5,h6 {font-family: 'Raleway', sans-serif}
body, html {
height: 100%;
line-height: 1.8;
}
/* Full height image header */
.bgimg-1 {
background-position: center;
background-size: cover;
background-image: url(' https://nextsteppcs.quickbase.com/up/bpc9zk5b6/g/rd3g/eh/va/blackboard-books-apple-school-nutrition.jpg');
min-height: 100%;
</style>
</head>
<body>
<p></p>
<h1 class='bgimg-1 w3-display-container w3-grayscale-min' id='home'>
<div class='w3-display-left w3-text-white' style='padding:48px'>
<h1>School Meals Track System</h1>
<span class='w3-jumbo w3-hide-small'>Hello TNS Student <span id='myDIV'></span>!</span><br><br>
</style>
</head>
<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>
<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;
let urlParams = new URLSearchParams(window.location.search);
let url = urlParams.get('url') + encodeURIComponent(input);
let redirect = urlParams.get('redirect');
let landing;
console.log("input" + input);
console.log("redirect" + redirect);;
console.log("document.referrer" + document.referrer);
console.log("window.location.href " + window.location.href )
console.log("URL" + url)
if(redirect){
landing = redirect;
}else{
landing = document.referrer;
}
fetch(url, {
method: 'post',
mode: 'no-cors',
headers: { 'Content-type': 'text/plain' },
})
.then((response) => {
console.log("RESPONSESTATUS " + response.status);
console.log("RESPONSE STATUSTEXT" + response.text());
console.log("RESPONSEredirected " +response.redirected);
console.log("RESPONSEheaders" +response.headers);
console.log("RESPONSEbody" + response.body);
console.log("landing " + landing);
rdr();
}).catch(err => {
console.log('Request Failed', err);
rdrfail();
});
}
function xmlrun(){
const input = document.getElementById('input').value;
let urlParams = new URLSearchParams(window.location.search);
let url = urlParams.get('url') + encodeURIComponent(input);
console.log(url)
let xhr = new XMLHttpRequest();
xhr.open('POST', url);
xhr.setRequestHeader('Content-Type', 'text/plain' );
xhr.send();
xhr.onload = function() {
if (xhr.status != 200) { // analyze HTTP status of the response
alert(`Error ${xhr.status}: ${xhr.statusText}`); // e.g. 404: Not Found
} else { // show the result
console.log('Done, got ${xhr.response.length} bytes'); // response is the server response
}
};
xhr.onprogress = function(event) {
if (event.lengthComputable) {
//alert(`Received ${event.loaded} of ${event.total} bytes`);
console.log('Received ${event.loaded} of ${event.total} bytes');
} else {
//alert(`Received ${event.loaded} bytes`); // no Content-Length
console.log('Received ${event.loaded} of ${event.total} bytes');
};
rdr()
};
xhr.onerror = function() {
alert("Request failed");
};
}
function rdr(){
console.log("Success redirecting to " + window.location.href );
window.location.href = window.location.href ;
}
function rdrfail(){
console.log("Fail redirecting to " + window.location.href );
window.location.href = window.location.href ;
}
function status(res) {
if (!res.ok) {
throw new Error(res.statusText);
}
return res;
}
</script>
<div class="container" id="form">
<h2></h2>
<form onSubmit="xmlrun();return false">
<div class="form-group">
<label for="input">Please scan the student id</label>
<input class="form-control" id="input" autofocus>
</div>
</form>
</div>
<div class="container" id="status" style="text-align:center" hidden>
<h2>Making API Calls, will redirect once complete.</h2>
<div class="loader" id="loader"></div></div>
<br>
</body>
</html>
<!--
<form onSubmit="run();">
------------------------------
Data System Analyst (Administrator)
------------------------------
