How to Save Record ID as a Field Value
I recently stumbled upon how amazing it would be if I could store the Record ID as a field value. So, I did. And learned you can do some amazing stuff with the Record ID such as creating custom URL paths in email, creating custom URL paths via Javascript, and making view-based API ajax calls from any view for any object (as long as you hide the record id somewhere accessible). If any of that interests you then here is how to save the Record ID into a field value upon record creation using a view-based API request. You can save the Record ID whether the user is logged-in or not.
Javascript:
// Function to Save Record ID
function save_Record_ID(recordID, scene_and_view, field_number) {
$.ajax({
url: "https://api.knack.com/v1/pages/" + scene_and_view + "/records/" + recordID,
type: "PUT",
headers: {
"X-Knack-Application-Id": Knack.application_id,
"X-Knack-REST-API-Key": `knack`,
"Authorization": Knack.getUserToken()
},
data: field_number,
tryCount: 0,
retryLimit: 3,
success: function(response) {
console.log("Captured Record ID"); // Success Message in Console Log
Knack.hideSpinner();
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
this.tryCount++;
let tryCount = this.tryCount, retryLimit = this.retryLimit, seconds;
if (tryCount <= retryLimit) { //try again
switch(tryCount) {
case 1:
case 2: seconds = 5; break;
case 3: seconds = 10; break; }
let timeout = seconds * 1000;
console.log("Error: " + XMLHttpRequest.status + " " + XMLHttpRequest.statusText + "\nRetry Count: " + tryCount + "\nRetrying in " + seconds + " seconds")
let ajaxObject = this;
window.setTimeout(function(){
$.ajax(ajaxObject);
}, timeout);
} else {
console.log("Failed to Capture Record ID");
}
}
});
}
// Listens for record creation and saves the record id when record is created.
$(document).on('knack-record-create.view_638', function(event, view, record) { // UPDATE the view number to the form used to create a record
const field_number = {field_667 : recordId}; // UPDATE the field number to the field used for storing the record id
const scene_number = "scene_238"; // UPDATE to the scene number for the form used to save the record id
const view_number = "view_2732"; // UPDATE to the view number for the form used to save the record id
save_Record_Id(record.id, scene_number & "/views/" & view_number, field_number);
});
// This is the separate edit form used to save the record id
// This removes the view from HTML upon rendering to prevent data manipulation.
$(document).on('knack-view-render.view_2732', function (event, view, record) {
$('#' + view.key).remove();
});
CSS:
/* Hide Second Form Just Incase. Don't substitute this with display:none */
#view_2732 {
position: absolute;
top: -9999px;
left: -9999px;
}
Code Tips & Tricks:
Keep in mind that the ajax url points to a seperate form (highly recommended to prevent record rule mayhem). Your users who submitted the first form will need to have access-rights to the second form in order for this to work. Personally, I always put my second form on the very next page after the first one (or within the same tree) to ensure my users will have access to it. On the second form, feel free to set up Record Rules that share the Record ID with any other records that need it. The CSS is optional but recommended to hide the second form before if is removed by javascript as a "just in case" precaution.
Speaking of precautions, you can also have a Knack Page Rule setup to redirect the user to the parent page (or any other page ie custom error page) if the page with the second form is ever accessed by a user (by some magic). This ensures that users cannot access this page and submit the form manually. To do that, you'll need to dedicate an entire page to the second form and ensure it is in the same tree as the record being created. Then, if you want, you can put any other hidden forms there too.