Update to Code Page Example Folder: All Videos Included
Hi everyone! I wanted to give you an update from the Code Pages Qrew Meetup: All 4 videos of code page examples from our speakers are now included in the Code pages folder. Here's a quick recap of what they covered in the meeting and here's the folder to watch the videos: Code Page Example Showcase by Elvis Agyemang: Elvis showed off a personalized homepage and a world clock, both built in minutes using ChatGPT—proof you can spin up cool tools fast. Tips: Use AI like ChatGPT to draft code page widgets or dashboards when you’re short on time. Process Messaging & Pipelines by Eric Mohlman: Eric demoed a code page that gives live progress updates for pipeline tasks—no more guessing if your process is done. Tips: Use webhooks to trigger progress bars and auto-redirects for a smoother user experience. Pass record IDs in the URL to keep your code pages flexible and reusable across different workflows. File Upload Controls & Multi-Table Assignments by Simon Herbst: Simon walked through file upload controls that check file type and size, with instant feedback using Bootstrap and Vue.js. Tips: Make your file upload page portable by passing table and field info in the URL—one page, many uses. Use real-time validation for file size and type to give users immediate, clear feedback (and avoid frustration). “Quicksheets” Code Page by Andrew Carbejal-Everts: Andrew recorded a short video on how to use code pages to export data to Excel to email different reports in a single file. Interested in reviewing their code page examples and using it for your use case? Here’s a link to a folder that has Code Page examples from Elvis, Eric, Andrew, and Simon. All videos included. Please let us know if you have any questions and we'll be sure to have experts review and respond. Thank you!
Code Page - Refresh not working
I have a URL Formula button on a record form, whose purpose is to prompt user for text input, update a text field with that input, and change status of record to "Done". I used the "Prompt for Input and Refresh" example in the code pages samples: https://resources.quickbase.com/db/bq8mgh24g?a=dr&rid=10414 After clicking the button, the field value updates, but the rather than display the record refreshed, I get an error: 404 Error, Page Unrecognized. So the first part of fetch code is executing correctly, but it seems the redirect is what is failing. Any help would be appreciated! Here's my button code: var text urlToExecute = URLRoot() & "db/" & Dbid() & "?a=API_EditRecord&apptoken=MYAPPTOIKEN&rid=" & [Record ID#] & "&_fid_26="; URLRoot() & "db/" & AppID() & "?a=dbpage&pageid=5" // Open code page 5 & "&url=" & URLEncode($urlToExecute) // Pass the URL to execute Here's the script and form portion of my code page 5: <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; if(redirect){ landing = redirect; }else{ landing = document.referrer; } fetch(url, { method: 'post', mode: 'no-cors', headers: { 'Content-type': 'text/plain' } }).then((response) => { rdr(landing); }) } function rdr(landing){ // Redirects to the specified landing page, if this page is the landing page as well, then redirect to the app home page if(landing && landing !== window.location.href) { window.location.href = landing; }else{ window.location.href = window.location.origin + window.location.pathname; } } </script> <div class="container" id="form"> <h2>Input Needed</h2> <form onSubmit="run();"> <div class="form-group"> <label for="input">Please provide some input</label> <input class="form-control" id="input" autofocus> </div> <a class="btn btn-primary" onclick="run()" role="button">Submit</a> <a class="btn" onclick="window.location.href = document.referrer;" role="button">Cancel</a> </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>Automatically save a form page as PDF and insert into attachment field?
I've long wondered if there's a solution that's shareable where I could click a button and have a form page automatically saved in PDF format and inserted into an attachment field. I realize that there are QSPs that provide this service, but I'm more interested in knowing/understanding how to do this myself. My impression is that you would need to use JS to write the form to PDF and then encode to base64, and then you could use the base64 result to insert into API_UploadFile. My JS knowledge is minimal but I can cobble stuff together through StackExchange plus trial and error. I'm not worried about the API end of things - that seems pretty straight-forward. Has anyone tried this themselves that they'd be willing to share? I've looked on the forum before but it seems the answers always fall into, "Hire a QSP," or "Use IOL or some other technique that is now deprecated." Presumably I'd need to call the JS from a code page? Or would I need a local API call on my end to launch something? If it's possible to do everything in QB without having to host something myself, that's obviously the preferable and most portable method, but if that's 100% not possible, I have access to AWS. Big picture goal is the user clicks a button, button calls a script that runs through about 20-30 records in a table, uses a specific QB form page to generate a PDF for each record, PDF is uploaded into corresponding record attachment field. No templates or anything. Short of that, clicking the button once per record would also be acceptable, but it would be rad to grab the whole table in one go.New dynamic filter plugin
This plugin allows you to make really dynamic filters, in the same window you can select the table, the fields you want to show and the fields you want to filter. It is not an external plugin, It must be included in one of your QuickBase APP. ------------------------------ Marcelo Benavides ------------------------------Code Page Submit Button Redirects to Webpage with Record ID
So I have a code page that is client facing so when the user hit submits (the submit button) I would like them to be directed to another webpage (code page) that in the URL holds the newly created record id. Below is some of the code: The xxxx are placeholders </table><input type=hidden name=rdr value='https://xxxxxxxx.quickbase.com/db/xxxxxx?a=dbpage&pageID=2'> <input type=submit value=Submit> ideally the value should be: "https://xxxxxxxxxxxxx.quickbase.com/db/xxxxxxxx?a=dbpage&pageID=2" + "&rid=" + rid Here is the java code: $.ajax({url: "xxxxxxxxxxx?act=API_AddRecord", type: 'POST', data: req1, contentType: "text/xml", dataType: "xml", processData: false, success: function(data, status, xhr) { var _rid = $(data).find('rid'); var rid = _rid[0].innerHTML; var customRedirectURL = "https://xxxxxxxxxxxxxx.com/db/xxxxxxxxxxxxx?a=dbpage&pageID=2" + "&rid=" + rid; window.location.href = customRedirectURL; ------------------------------ Lija Harris ------------------------------Displaying Formula - Text Field on a Code Page
I have a code page input form as a easy web intake interface for our clients. I was able with the form wizard to grab all the input fields (example code is below). However, I was wondering if it was possible to add a formula field to the code page? Specifically a formula - text field that is just static text but needs to be on the code page. Is it possible to put a formula field that is static on a code page (html/javascript): <h2 span style="color: white; font-family: Sans-serif; text-align: center; background-color: #358281;">Customer Data Intake Form</h2><form name=qdbform method=POST onsubmit='return validateForm(this)' encType='multipart/form-data' action=https://blahblah.quickbase.com/db/XXXXXXXXx?act=API_AddRecord&apptoken=xxxxxxxxxxxxxxxxxxxxxxx> <input type=hidden name=fform value=1> <table class="center"> <table> <tr><td style="font-family: Sans-serif;" class=m>Contractor Business Name:</td> <td class=m><input type=text size=40 name=_fid_6 ></td></tr> <tr><td style="font-family: Sans-serif;" class=m>End User Customer First Name:</td> <td class=m><input type=text size=40 name=_fid_7 ></td></tr> ----------Where the formula - text field will go--------------------- ------------------------------ Lija Harris ------------------------------
