Skip to main content
Question

Save new record, pause, refresh

  • July 16, 2023
  • 0 replies
  • 309 views

Forum|alt.badge.img+3

I love the Quickbase Code Page Samples App, with all it's pausing and refreshing. However, there's no sample codes for adding a new record, pausing and going to the saved record.

Anyone out there know how to make a button when adding a record that will pause for 2 seconds before showing the new record?

Here's the Code Page Samples intro:

https://community.quickbase.com/blogs/graham-leto2/2021/03/02/code-page-samples



------------------------------
Matt Stephens
------------------------------
This topic has been closed for replies.

  • Registered
  • July 17, 2023

Here's the page you're looking for:

https://resources.quickbase.com/db/bq8meiyhh?a=dr&key=14

To get here from the code pages home, click the big purple button on the left, then fill out the new record form and submit. On the next page, click the instructions button on the right. It will then (finally) take you to the instructions page I linked. Simple, right?

Their example is really complex and IMO kind of redundant with an existing native add record form. If your user needs to provide input to create the record, then I would simply link them to the existing add record form and be done with it.

But if you already have a code page that is doing something else (like generating a lot of data that you eventually want added to a record), then the QB example is probably more appropriate (albeit far more complicated).

Without providing the code (because a lot of it would be out of context), here's how I've cracked this in the past using JS in a code page:

  • Prep the data/payload for the JSON API request
  • Prep the headers for the same request
  • Make the request (with a synchronous ajax request)
  • Parse the response to get the record ID
  • Construct the URL containing the new record ID
  • Open the URL



------------------------------
gary
------------------------------

Forum|alt.badge.img+7
  • Registered
  • July 17, 2023
Hi, something like this should work as a code page. Largely the work of ChatGPT :)
<html>
<head>
<title>Demo code</title>
 
<style>
 
body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  margin: 0;
}
 
.spinner {
  border: 4px solid rgba(0, 0, 0, 0.3);
  border-top: 4px solid #007bff;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 2s linear infinite;
  display: none; /* Initially hidden */
}
 
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
 
</style>
 
</head>
 
<script>
 
// Function to show the spinner
 
function showSpinner() {
  const spinner = document.getElementById("spinner");
  spinner.style.display = "block"; // or "inline-block" or "flex", depending on the context
}
 
// Function to hide the spinner
 
function hideSpinner() {
  const spinner = document.getElementById("spinner");
  spinner.style.display = "none";
}
 
$(document).ready( function() {
 
// Show the spinner
 
showSpinner();
 
// Incorporate a 2 second delay
 
setTimeout(() => {
// Some code
}, 2000);
 
});
 
</script>
 
<body>
<div id="spinner" class="spinner"></div>
</body>
 
</html>


------------------------------
Jeremy Anson
------------------------------