Filters

Filters
is
 
Forum Title
OldPostUrl
Content
 
Can you test a URL formula to determine if a web page is valid? PostURL Here is any easy way to set up the formula URL field that when clicked will run your JavaScript.

1) Create two user defined variables named [script] and [/script] with the following definitions:

[script]=

javascript:$.getScript(gReqAppDBID+'?a=dbpage&pagename=

and
[/script]=

');void(0);

2) Create a user defined page named myscript.js and place your JavaScript in this page. You should probably just put an alert statement in this page to start with to test you have everything set up correctly.

3) For every place you want to invooke the script write a formula URL with the following definition:
[script] & "myscript.js" & [/script]

You probably want to configure this field so it displays as a button.

4) If you need another formula URL field that runs JavaScript just repeat steps 2 and 3 above as your application already has [script] and [/script] set up.
how to call javaScript function from Formula URL PostURL Image Onload User Defined Variables

iol=
<img qbu='module' src='/i/clear2x2.gif' onload="javascript:if(typeof QBU=='undefined'){QBU={};$.getScript(gReqAppDBID+'?a=dbpage&pagename=

/iol=
&rand='+new Date().getTime())};">

usage with formula text field:
[iol] & "module.js" & [/iol]

GetScript User Defined Variables

script=
javascript:$.getScript(gReqAppDBID+'?a=dbpage&pagename=

/script=
&rand='+new Date().getTime());void(0);

usage with formula URL field:
[script] & "myscript.js" & [/script]
How to base a new field value off an old field value. PostURL Formula Definitions for iol and /iol user defined variables

iol
<img qbu='module' src='/i/clear2x2.gif' onload="javascript:if(typeof QBU=='undefined'){QBU={};$.getScript(gReqAppDBID+'?a=dbpage&pagename=

\iol
&rand='+new Date().getTime())};">
I am sure I have done something wrong, PostURL >I am sure I have done something wrong, 

This can be confusing if you don't understand all the technical details. The provided code does not go into a formula - rather it goes into a user defined page (typically named module.js) and a special formula is used to cause that page module.js to automatically load as if it was part of the source of the original form page. This technique is affectionately called the image onload technique because it employs writing a special formula that inserts an invisible image into the page and uses the onload attribute of that image to load the user defined page module.js. Despite the technical details, the procedure I describe below will allow anyone to setup the image onload technique. What follows is the "second" version of the image onload technique which improves on the first version but is functionally equivalent. Also note that this is a workaround to allow you to enhance forms and pages with additional features and capabilities while we lobby for QuickBase to come up with a supported method of allowing an administrator (not a mere user) to specify that a user supplied JavaScript file should be attached to a form/page for unrestricted purposes. 

Step 1

Insert two user defined variables into your application named iol and /iol with the following definitions:

iol=

<img qbu='module' src='/i/clear2x2.gif' onload="javascript:if(typeof QBU=='undefined'){QBU={};$.getScript(gReqAppDBID+'?a=dbpage&pagename=

/iol=

&rand='+new Date().getTime())};">

These two variables are named so that when they are used in formulas they are reminiscent of HTML markup (see Step 3).


Step 2

Create a user defined page named module.js (or similar) and initially place in it the following single statement:

alert("module.js is now loaded - I now own your page");

We will replace this page's contents with some (1) boiler plate code and (2) custom code to implement various additional features. We are on training wheels for the time being.

Step 3
In any table where you want to use an image onload field (typically named [-]) create a text formula field with some HTML allowed using this formula:

[iol] & "module.js" & [/iol]

This formula uses the two user defined variables [iol] and [/iol] to simplify the formula and allow you to easily remember the formula if you choose to use it in other tables. Once the user defined variables [iol] and [/iol] are set up you can create additional image onload fields in other tables and forms with similar definitions:
[iol] & "moduleJumpTheShark.js" & [/iol]
You will of course have to create a new user defined page named moduleJumpTheShark.js for this additional instance.

Step 4
In the field properties page for the image onload field [-] configure the following properties:

Check:
Allow some HTML tags to be inserted in the field (Already set in Step 3)
Uncheck:
Include this field when searching/filtering this table
Reportable    Add this field to all new reports
The field may be used in reports
Step 5
Place the image onload field [-] on the form you want to enhance. It does not matter where you put the field because we will make all efforts to insure the the field's inclusion on the form is not visible. Set the field to have Alternate Label text but leave the Alternate Label text empty (so it will not be visible). What we are doing here is merely including an invisible image on the form for the sole purpose on forcing our user defined page module.js to load as if it was originally part of the QuickBase page.

You can additionally control which pages the image onload field is included on by setting the field property Display when this form is used for to one of the following selectable values:

edit

view

add

edit or add

edit or view

add or view

edit, add or view

This control including the image onload field on a {add, view, edit} form is a secondary mechanism to control when the image onload field is called into action to enhance the form's behavior. You can also include logic in the user defined page module.js to control the enhance form's behavior. As it stands now the user defined page merely includes an alert() statement to get you familiar with how the image onload technique works.
Step 6

Now visit a form that has been configured to include the image onload field. What you should observe that the form loads in its normal fashion but automatically an alert displays. You now have control of your page and can customize and enhance it. This is where the creative juices will flow so it is time for a celebratory song:

http://goo.gl/xtWtnE

Step 7

Now that you have the image onload technique setup in your application you can modify the code in module.js to detect what type of page you are on and supply additional custom logic. The following is a generic template for module.js which can be used to detect which type of page is being displayed:

Pastie Database

https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=293

Note that the logic in this generic template is only evaluated if you have configured the image onload field to be included on the form in in Step 5.
Step 8

When I answer questions in the forum where I make reference to using the image onload technique all of the steps above are assumed to be undertaken and I typically only post the essential code that would be needed within any one branch of the generic template. This approach allows me to quickly develop "state of the art" customization techniques as questions come up without getting bogged down in endlessly repeating predicate information. Also you may well have to do some additional work or hire a developer if you want a production solution that meets your exact needs.

Step 9

The setup of the image onload technique can be automated. For details see this entry:

Is there a new "image onload technique" in town?

https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=242

Notes

The use of user defined variables in formulas eliminates some tricky escaping you would otherwise have to do in writing formulas.
The customary names used for the user defined page module.js and the image onload field [-] are not significant.
The attribute qbu='module' added to the image onload field is actually not needed and is more of a historical artifact used during development. I retain it mostly to avoid coming up with new versions of the technique.
The testing for the existence of QBU is only needed to prevent repeated triggers of module.js when the [-] field is included on reports and grid edits.  I retain it mostly to avoid coming up with new versions of the technique.
The inclusion of the &rand parameter is currently not needed and was included as a cache busting technique. QuickBase never explicitly states their caching policy so I thought it wise to include it.  I retain it mostly to avoid coming up with new versions of the technique.
The generic template uses an  Immediately Invoked Function Expression (IIFE) - Google it if you want the details. In practical terms what this means is the variables you use within the IFFE will not interfere with QuickBase's global variables. However, you are free to dip into QuickBase's global name space and user their global variables (with great caution). I sometimes use the QuickBase global variable kRid which holds the decimal value of the [Record ID#] on View or Edit pages. Use this approach carefully as there is no guarantee that QuickBase will continue to use any global variables.
If you inject anything in a QuickBase authored page you have to insure you do not conflict with QuickBase global variables. This includes element IDs, CSS classes, as well as JavaScript variables. The safest approach is to always prefix such constructs with the prefix QBU.
Other stuff as I think of it ... Enjoy
What Is The New QuickBase Hotness? (Import Onload Technique) PostURL Formulas for injecting a HTML import into page:
[import]=
<img qbu=import src=/i/clear2x2.gif onload="javascript:$('<link>',{rel:'import',href:gReqAppDBID+'?a=dbpage&pagename=

[/import]=
'}).appendTo('head');">

Usage:
[import] & "import.html" & [/import]
Old Image Onload Technique   http://pastebin.com/hbeXXmTT

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/.test(querystring)) {
  //GRID EDIT PAGE ========================================
  alert("You are on the Grid Edit Page");
 
 } else if(/a=er/.test(querystring)) {
  //EDIT RECORD PAGE ========================================
  alert("You are on the Edit Record Page");
 
 } else if (/GenNewRecord/.test(querystring)) {
  //ADD RECORD PAGE ========================================
  alert("You are on the Add Record Page");
 
 } else if(/a=dr/.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/.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.
What Is The UNOB Technique? PostURL Step (1)
Don't even attempt to write a complicated URL formula - just concatenate an anchor element to your standard image onload field (ie [-]) like this:

[iol] & "module.js" & [/iol]
&
"<a class='QBU_MyClass Vibrant Success'>Do Something Impressive</a>"

This formula will bootstrap the loading of module.js upon page load and essentially fill the real estate taken up by the [-] field with a nicely styled button. Note there is no href or event handler attributes on this anchor element. Attempting to add a href or event handler attribute through the formula language will only bring grief, sorrow and misery.

Step (2)
Within module.js simple place code that will detect and process click events on anchors with class QBU_MyClass like so:

$(".QBU_MyClass").on("click", function(event) {
  alert("Do Something Impressive");
});

You will have to place this code within appropriate page decode logic as specified in the generic module.js of the image onload technique template. If you need access to the [Record ID#] or other fields to implement your Something Impressive don't waste your time trying to pass these values through the QuickBase formula URL field. Doing so will only complicate your formula and encourage errors and typos. Instead, simply make an AJAX call within module.js to grab the field values you need to do Something Impressive.

Step (3)
There is no third step - you are done. Enjoy:
What Is The UNOB Technique? PostURL [-] Formula URL Field:

[iol] & "module.js" & [/iol]
&
"<a class='QBU_MyClass Vibrant Success' data-rid=" & [Record ID#] & ">Do Something Impressive</a>"
===================================================
module.js:
(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");
    $(".QBU_MyClass").on("click", function(event) {
      var rid = $(event.target)[0].dataset.rid;
      alert("Do Something Impressive\n[Record ID#] = " +rid );
    });

  } else if (/a=API_GenAddRecordForm/i.test(querystring)) {
    //API_GenAddRecordForm PAGE ========================================
    //alert("You are on the GenAddRecordForm Page!");

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

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

  } else if(/a=dr/i.test(querystring)) {
    //DISPLAY RECORD PAGE
    //alert("You are on the Display Record Page");
    $("img[qbu=module]").closest("td").css("background-color","#FFFFFF");
    $(".QBU_MyClass").on("click", function(event) {
      var rid = $(event.target)[0].dataset.rid;
      alert("Do Something Impressive\n[Record ID#] = " +rid );
    });

  } else if(/a=q/i.test(querystring)) {
    //REPORT PAGE ========================================
    //alert("You are on the Report Listing Page");
    $(".QBU_MyClass").on("click", function(event) {
      var rid = $(event.target)[0].dataset.rid;
      alert("Do Something Impressive\n[Record ID#] = " +rid );
    });

  } else if(/a=td/i.test(querystring)) {
    //TABLE DASHBOARD PAGE ========================================
    //alert("You are on the Table Dashboard Page");
    $(".QBU_MyClass").on("click", function(event) {
      var rid = $(event.target)[0].dataset.rid;
      alert("Do Something Impressive\n[Record ID#] = " +rid );
    });

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

})();
Ranking On Reports PostURL [Index] Formula:

[iol] & "module.js" & [/iol]
&
"<span class="QBU_Count"></span>

===========================
module.js:
 (function(){
  var querystring=document.location.search;

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

    var $records = $(".QBU_Count");

    $records.each(function() {
      var index = $records.index(this) + 1;

      $(this).html(index);
    });
  } 

})();
How To Get IOL Working on Mobile? PostURL [iolm]=
<img qbu='module' src='/i/clear2x2.gif' onload="javascript:if(typeof QBU=='undefined'){QBU={};$.getScript(gReqInfo.currentDbid + '?a=dbpage&pagename=

[iolm]=
&rand='+new Date().getTime())};">
How do I add our company Logo to a report for printing? PostURL [-] is a text formula field with some HTML allowed with the following definition:

"<div style='position: fixed; top: 0; left: 30%;'><img src=&#039;https://d2iua9xsrei43a.cloudfront.net/uploads/avatars/650/small.png' height='30' width='30'></div>"
Trying to use one formula URL button to do two things. PostURL Button Formula

[iol] & "moduleCancelForWeather.js" & [/iol]
&
"<a class='QBU_MyClass Vibrant Success' data-rid=" & [Record ID#] & ">Cancel For Weather</a>"

moduleCancelForWeather.js

(function(){

  var dbid = "xxx";
  var dbidAppointments = "xxx";
  var dbidServices = "xxx";
  var dbidNotes = "xxx";
  var apptoken = "xxx";
  $.ajaxSetup({data: {apptoken: apptoken}});

  var querystring=document.location.search;

  if(/a=dr/i.test(querystring) || /a=q/i.test(querystring)) {

    $("img[qbu=module]").closest("td").css("background-color","#FFFFFF");
    
    $(".QBU_MyClass").on("click", function(event) {
      var rid = $(event.target)[0].dataset.rid;
      
      var promise1 = $.get(dbidAppointments, {
        act: "API_EditRecord",
        rid: rid,
        _fid_139: "1",
        _fid_138: "Weather"
      });

      var promise2 = $.get(dbidAppointments, {
        act: "API_DoQuery",
        query: "{3.EX." + rid + "}",
        clist: "10"
      });
      promise2.then(function(xml) {
        var relatedService = $("related_service", xml).text();

        var promise3 = $.get(dbidNotes, {
          act: "API_AddRecord",
          _fid_7: relatedService,
          _fid_16: "Status Note for Client",
          _fid_6: "Due to inclement weather, we will not be able to perform this scheduled service. We will reschedule this based on weather, and will let you know the updated time."
        });
        promise3.then(function(xml) {
          document.location.reload(true);
        });
      });
    });
  }

})();
Table with URLs. Need to track the last time a URL was clicked. ## thoughts: set the link up to "touch" the record, which would update the modification date. PostURL [url2] formula:
[iol] & "moduleTable1.js" & [/iol] &
"<a class='QBU_Button Vibrant Success' data-url='" & [URL1] & "' data-rid='" & [Record ID#] & "'>URL</a>"

==========
moduletable1.js:

(function(){
  var querystring=document.location.search;

  var dbid = "bkjpctwja";
  var dbidTable1 = "bkjpctwk8";
  var apptoken = "8v3i2tb2cfkxtbcsvspddvusmzm";
  $.ajaxSetup({data: {apptoken: apptoken}});

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

    $(".QBU_Button").on("click", function() {
      var url = this.dataset.url;
      var rid = this.dataset.rid;

      $.get(dbidTable1, {
        act: "API_DoQuery",
        query: "{3.EX."  + rid + "}",
        clist: "6"
      }).then(function(xml) {
        var count = parseInt($("count", xml).text(), 10);
        $.get(dbidTable1, {
          act: "API_EditRecord",
          rid: rid,
          _fid_6: count+1
        }).then(function() {
          window.open(url);
          document.location.reload();
        });
      });


    });
  }

})();
What Is The Off With Their Heads Technique? PostURL command:

DOS>casperjs test3.js

==========
script: test3.js

var casper = require('casper').create({
  //verbose: true,
  //logLevel: "debug"
});

casper.start("https://haversineconsulting.quickbase.com/db/main?a=SignIn", function() {
  this.fill('form[name=mainform]', {
    loginid: "dandiebolt@yahoo.com",
    password: "XXXXXXXXXX"
    }, false);
  this.capture("qbtest3_1.png");
  this.click("#signin");
});

casper.waitForUrl("https://haversineconsulting.quickbase.com/db/main", function() {
  this.capture("qbtest3_2.png");
});

casper.thenOpen("https://www.quickbase.com/db/6ewwzuuj?a=q&qid=6&dlta=pr~fl7.11.8.9.10.~", function() {
  this.capture("qbtest3_3.png");
});

casper.waitUntilVisible("#qbDialogPrint", function() {
  this.capture("qbtest3_4.png");
});

casper.then(function() {
  this.click("#qbDialogPrint button.Confirm");
  this.capture("qbtest3_5.png");
  this.capture("qbtest3_5.pdf");
});

casper.run(function() {
  this.exit();
});
What is the [script] technique? PostURL [script] text formula field with some HTML allowed

<img qbu='module' src='/i/clear2x2.gif' onload="if(typeof QBU=='undefined'){QBU={};$.getScript(gReqAppDBID+'?a=dbpage&pagename='+gReqDBID+'_'+gDFID+'.js&rand='+new Date().getTime())};">
rurl with anchor? PostURL 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/.test(querystring)) {
  //GRID EDIT PAGE ========================================
  alert("You are on the Grid Edit Page");

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

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

 } else if(/a=dr/.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/.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.
QuickBase AutoSave? PostURL 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/.test(querystring)) {
  //GRID EDIT PAGE ========================================
  alert("You are on the Grid Edit Page");

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

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

 } else if(/a=dr/.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/.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.
Does anyone know how I can style and add color to various sections on a Quickbase form? PostURL 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/.test(querystring)) {
  //GRID EDIT PAGE ========================================
  alert("You are on the Grid Edit Page");

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

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

 } else if(/a=dr/.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/.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.
Change "Save" Button to read "Submit" PostURL 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/.test(querystring)) {
  //GRID EDIT PAGE ========================================
  alert("You are on the Grid Edit Page");

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

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

 } else if(/a=dr/.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/.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.
Automatically execute Javascript on form open? PostURL 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.

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
Report Name *
Description
Reports and Charts Panel
Each table has a panel listing its reports and charts, organized in groups.
This report will be listed only for you, in the group Mine.
Only you can see the report in the panel. You can't ever list it for other users. You can still let others open it by sending them links.
Please wait while your new report is saved...
You've made changes
Save
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:

Read more about converting a column into a table.

Show fields from Show fields from Show fields from a related table