Script to Run on Every Page of Your Database

To enhance database functionality even further, we’ve added the ability to run custom scripts on every page of your database. To align with the dbstyles.css logic, all you need to do is place dbscript.js in your database’s resources section.

Since the script file is loaded and executed asynchronously, its exact execution time is not known and may occur before the page is fully loaded. If you intend to modify page content using script code, you may need to delay code execution until later. You can rely on jQuery facilities to achieve this:

jQuery(function() {
    // Here, the page load is complete
    // Insert some content on top of every page
    jQuery("#td-bodyframe").prepend("<p>This will appear below tabs and above the page's content</p>");
});

Limiting Script Execution Scope

Each page’s <body> tag has an identifier created from the page’s name and the table’s internal identifier, such as overview_t_909. You can use CSS selectors, just like with dbstyles.css, to limit script execution to specific contexts using jQuery.

jQuery(function() {
    if (jQuery("body[id^='overview']").length) {
        // This will run on every overview page but not on views and forms
    }
    if (jQuery("body[id$='_t_909']").length) {
        // This will run on any page in the Invoice table
    }
    if (jQuery("body#overview_t_909").length) {
        // This will run on the overview page of the Invoice table
    }
});

Loading External Libraries

If you require external libraries, you can use the FS.addScript(url, callback) function to request the library script and execute code after the library is loaded:

FS.addScript("//maps.googleapis.com/maps/api/js", function() {
    // Perform Google Maps operations here
});

Real-World Example

Suppose you want to implement Google Analytics. Simply place their code (without surrounding script tags) in your dbscript.js, with a modified tracking ID, of course:

(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');