Discussions

 View Only
  • 1.  Redirect code page that show the new record

    Posted 07-18-2022 18:30
    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)
    ------------------------------


  • 2.  RE: Redirect code page that show the new record

    Posted 07-18-2022 20:21
    https://resources.quickbase.com/db/bq8meiyhh?a=dr&key=-1

    I think this achieves what you want, create a new record and take you there.

    ------------------------------
    Prashant Maheshwari
    ------------------------------



  • 3.  RE: Redirect code page that show the new record

    Posted 07-19-2022 15:00
    Hello

    thank you.

    when it redirects to the HTML page, I look for the new record to be reflected there. Also thanks for the info. very if from there I can find the solution.


    ------------------------------
    Data System Analyst (Administrator)
    ------------------------------