Forum Discussion
TylerBrezler
4 years agoQrew Cadet
Very cool! Thanks for working on this, Sean. I'm going to try this out as soon as I get the chance.
SeanConnaughto1
4 years agoQrew Cadet
Like I said before, this isn't the prettiest, but it worked for me! This should loop through and save each form within the range you enter in the popup.
Formula Rich-Text Field:
HTML:
JavaScript Page:
------------------------------
Sean Connaughton
------------------------------
Formula Rich-Text Field:
var text usertoken = "enter_user_token_here";
// Enter the form ID to save in myFormID
var text myReq = "&myDbid=" & Dbid() & "&recId=" & [Record ID#] & "&myFormId=10&usertoken=" & $usertoken;
var text apptoken = "app_token_here";
var text url = URLRoot() & "db/" & AppID() & "?a=dbpage&pageID=10" & "&apptoken=" & $apptoken & $myReq;
"<a class='OpenAsPopup' href='" & $url & "'data-height=600 data-width=600>Print as HTML</a>"
HTML:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.2/html2pdf.bundle.js"></script>
</head>
<body>
<h1>Saving Forms as PDF</h1>
<p>Records will populate below when completed.</p>
<p>Depending on the size, it may take longer than expected to start. Check the console for more details.</p>
<div id="dbPagePayload"></div>
</body>
<script src="https://yourRealm.quickbase.com/db/yourAppID?a=dbpage&pageID=YourJSPageID"></script>
</html>
JavaScript Page:
let urlParams = new URLSearchParams(window.location.search);
let lowRec = prompt("Enter the low Record ID#");
let highRec = prompt("Enter the high Record ID#");
let countLength = 0;
let dbid = urlParams.get("myDbid");
let myForm = urlParams.get('myFormId');
let usertoken = urlParams.get('usertoken');
let apptoken = urlParams.get('apptoken');
let root = location.protocol + '//' + location.host;
const myHostName = "EnterHostName.quickbase.com";
const myDiv = document.getElementById('dbPagePayload');
var headers = {
'QB-Realm-Hostname': myHostName,
'User-Agent': 'Find_Records',
'Authorization': `QB-USER-TOKEN ${usertoken}`,
'Content-Type': 'application/json'
}
var body = {"from": dbid,"select":[3],"where":`{3.GTE.'${lowRec}'}AND{3.LTE.'${highRec}'}`}
fetch('https://api.quickbase.com/v1/records/query',
{
method: 'POST',
headers: headers,
body: JSON.stringify(body)
})
.then(async res => {
if (res.ok) {
return res.json().then(res => {
console.log(res)
countLength = res.metadata["numRecords"];
if (countLength > 1) {
myDiv.innerHTML += `Found ${countLength} records within the entered range.<br><br>`
}else if (countLength == 1) {
myDiv.innerHTML += `Found ${countLength} record within the entered range.<br><br>`
}else {
myDiv.innerHTML += `Found 0 records within the entered range.<br><br>`
};
console.log(countLength)
myData(res.data)
});
}
return res.json().then(resBody => Promise.reject({status: res.status, ...resBody}));
})
.catch(err => console.log(err))
const myData = (resOriginal) => {
var counter = 0
resOriginal.forEach(ele => {
let val = ele[3].value;
console.log(`Done - Rec ID Level: ${val}`)
let myURL = `${root}/db/${dbid}?a=API_GetRecordAsHTML&rid=${val}&dfid=${myForm}&apptoken=${apptoken}`;
$.post(myURL, {}, function (response) {
let myDoc = response;
var opt = {
margin: 1,
filename: 'myfile.pdf',
image: { type: 'jpeg', quality: 0.98 },
html2canvas: { scale: 2 },
jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' }
};
html2pdf().from(myDoc).set(opt).outputPdf('dataurlstring').then(async res => {
var base64result = res.split(',')[1];
console.log(val);
var headers = {
'QB-Realm-Hostname': myHostName,
'User-Agent': 'File_Upload',
'Authorization': `QB-USER-TOKEN ${usertoken}`,
'Content-Type': 'application/json'
}
body = { "to": dbid, "data": [{"3": {"value": val}, "59": { "value": { "fileName": "FormPDF.pdf", "data": base64result }} }], "fieldsToReturn": [ 3, 59 ] }
fetch('https://api.quickbase.com/v1/records',
{
method: 'POST',
headers: headers,
body: JSON.stringify(body)
})
.then(async res => {
if (res.ok) {
return res.json().then(res => {
console.log(res)
counter++
myDiv.innerHTML += `Record ID#: ${val} - Complete - ${counter}/${countLength}<br><br>`
});
}
return res.json().then(resBody => Promise.reject({status: res.status, ...resBody}));
}).catch(err => console.log(err))
});
});
console.log(`Done - getURL Record: ${val}`)
})
};
------------------------------
Sean Connaughton
------------------------------
- JeffPeterson13 years agoQrew CaptainSean,
This is very cool. I was able to get it working and this will definitely come in handy!
------------------------------
Jeff Peterson
------------------------------- NirajShah43 years agoQrew CadetHi Sean,
You were able to get this working and have a PDF attached to a file attachment field? I followed the steps above and all I am getting it to do is open the form as a popup but nothing is saved as a PDF in my attachment field.
Thanks,
Niraj
------------------------------
Niraj Shah
------------------------------