QuickBase: Load javascript file every time it searches in tables

Question

Okay, so I have a javascript file that launches which injects another javascript file which creates checkbox per row. The js loader file looks like this:

//Run these scripts on all table pages
if (gReqTemplName == "searchresults") {
    console.log(kRecordNamePlural, gReqQID);
    if ((kRecordNamePlural == "Time Cards" && gReqQID == 37) || (kRecordNamePlural == "Milestone Payments" && gReqQID == 11) || (kRecordNamePlural == "Expenses" && gReqQID == 11)) {
        $.getScript('/js/QuickBaseClient.js', function (data) {
            $.getScript(gReqAppDBID + '?a=dbpage&pagename=approve.js');
        });
    };
}

This specific pageID 37 table has search function. The problem is, When I do the search, the injected javascript doesn't work anymore. Meaning, the checkbox per row doesn't show anymore in the result.

Any ideas?

Answer 1

The contents of the report are erased and rewritten whenever the search box is used. Since the page isn't reloaded to do this, whatever changes that approve.js made when it was loaded are not applied to the newly created elements. You can use this technique here to make your code run after that report is updated. The method you want to cache is QB.Faceting.Instance.tableHomePageView.reportView.updateReport and will look something like this:

QB.Faceting.Instance.tableHomePageView.reportView.updateReport = (function(){
    var cachedFunction = QB.Faceting.Instance.tableHomePageView.reportView.updateReport;
    return function(){
        var result = cachedFunction.apply(this, arguments);
        // Your code that inserts checkboxes
    };
})();

Note: This will stop working if Quickbase changes its method names or the way search boxes work. If this is a critical business function you may want to write a custom page that handles its own layout and makes changes to records via API calls. That way you're insulated from UI updates.