Forum
Automatically execute Javascript on form open?
Forum
Demo
Content
[Content] is a narrative description of a technique
The Image Onload Technique Used With QuickBase
==============================================

The image onload technique is a workaround that allows you to load and 
execute a user supplied javascript file immediately upon loading one of 
the following five types of pages: 

1) create new record;
2) view existing record;
3) edit existing record; 
4) report listing; and 
5) grid edit

It is a safe and flexible technique and is one of only two ways of 
accomplishing this feat. I am not telling anyone the second way in 
case the first technique goes away.

It works because an image with an onload attribute will execute the specified 
code when the page is loaded. Because jQuery is now served as part of every 
page the method $.getScript(url) can specify what user defined page should be 
loaded and the customized javascript can perform various patchwork to the page 
as if that javascript was originally part of the served page. The are a number 
of additional tricks employed that are quite technical but luckily you will 
probably never have to changed them. 

The following three step procedure describes the essential steps.

STEP 1

Create a field with the following formula definition and include it in your 
form/report. You will never have to modify this formula other than to possibly 
change the name of the user defined page (module.js). Although we are inserting 
this field into the form/report we take every possible step to hide its 
appearance on the form

I often use a hyphen or minus sign for the name of the field.

[- (text formula field with some HTML allowed)]=
"<img qbu=\"module\" src=\"/i/clear2x2.gif\" " &
"onload=\"javascript:if(typeof QBU=='undefined'){QBU={};$.getScript('" &
URLRoot() &
"db/" &
Dbid() &
"?a=dbpage&pagename=module.js&rand='+Math.random())}\">"

==================================================
STEP 2

Create a user defined Page named "module.js" and place your custom code 
in the section under the alert statement. You do not need to prefix your 
javascript variables with QBU_ to avoid namespace collisions if they are 
place with in the "self executing anonymous function" (function(){ ...})(); 
that acts as a wrapper.

(function(){

 var querystring=document.location.search;

 if (/dlta=mog/i.test(querystring)) {
  //GRID EDIT PAGE ========================================
  alert("You are on the Grid Edit Page");

 } else if(/a=er/i.test(querystring)) {
  //EDIT RECORD PAGE ========================================
  alert("You are on the Edit Record Page");

 } else if (/GenNewRecord/i.test(querystring)) {
  //ADD RECORD PAGE ========================================
  alert("You are on the Add Record Page");

 } else if(/a=dr/i.test(querystring)) {
  //DISPLAY RECORD PAGE
  $("img[qbu=module]").closest("td").css("background-color","#FFFFFF");
  alert("You are on the Display Record Page");

 } else if(/a=q/i.test(querystring)) {
  //REPORT PAGE ========================================
  alert("You are on the Report Listing Page");

 } else {
  //OTHER PAGE ========================================
  alert("You are on the Some Other Page");
 }

})();

==================================================

STEP 3

In any form where you include the field [-] select alternate label text and 
leave the text empty. This in conjunction with the code in the user defined 
page will hide the presence of the field on the form.
Copy [Content] to Clipboard
PastieURL
Usage Notes
Image Onload Technique
Other & Flags
Yes  
Diebolt, Dan
Created on July 22, 2011 at 12:09 PM (CST). Last updated by Diebolt, Dan on March 11, 2018 at 10:11 AM (CST). Owned by Diebolt, Dan.
Dan Diebolt
Dan Diebolt
Show fields from Show fields from Show fields from a related table
Report Name *
Description
Reports and Charts Panel
Each table has a panel listing its reports and charts, organized in groups.
Please wait while your new report is saved...
Field label
Column heading override
Justification
What does auto mean?
Fields in:

Fields to Extract:

Name for the new table:
Items in the new table are called:

When you bring additional fields into a conversion, Quick Base often finds inconsistencies. For example, say you're converting your Companies column into its own table. One company, Acme Corporation, has offices in New York, Dallas and Portland. So, when you add the City column to the conversion, Quick Base finds three different locations for Acme. A single value in the column you're converting can only match one value in any additional field. Quick Base needs you to clean up the extra cities before it can create your new table. To do so, you have one of two choices:

  • If you want to create three separate Acme records (Acme-New York, Acme-Dallas and Acme-Portland) click the Conform link at the top of the column.
  • If the dissimilar entries are mistakes (say Acme only has one office in New York and the other locations are data-entry errors) go back into your table and correct the inconsistencies—in this case, changing all locations to New York. Then try the conversion again.

Read more about converting a column into a table.

We're glad you're interested in doing more with Quick Base!

Now we need to make you official before you share apps or manage your account.

Verifying your email lets you share Quick Base with others in your company.

Your work email
Your company