Why are substitution strings being ignored within my JavaScript static application files (Oracle APEX)?

Question

Premise

I am new to APEX and JS. Please try to explain any code suggestions or approaches in detail or provide links to help me understand your direction. I am very thankful for anyone who takes the time to try and help me, but I would hate to have to ask you to find time to help me again if I don't understand what you are saying.

The Problem

I am trying to use a static JS application file to provide a series of functions that can be used across my application. The task, or at least my approach, requires the use of substitution strings. These substitution strings are not getting substituted when a static file link is provided. I can access the functions just fine, so the link itself is working, however, the application is refusing to fill in the necessary substitutions. If I place the JS code directly in my page, say inside the HTML Code section of a static region, I get the desired results and I am able to achieve my vision. My preference was to utilize the static app files feature so the code did not need to be stored inside the app/pages for what I believe would be easier source code maintenance.

The Task

In case it helps, this section details what I am trying to do and why. I am converting our current application from Oracle Forms 11g to APEX. Our current app often provides search/find screens that allow the user to enter a variety of parameters to help narrow down their options. These find screens are linked to fields triggered by the LOV (KEY-LIST-VALUES) and will set global variables on the way out and expect global variables on the way back. An example global going out would be :global.account_type := 'EXPENSE';. This would be used in a case where a user wants to assign a GL Account to a portion of the system setup and that field requires the account to be an expense account, so when the find screen notices the global type being set, it auto-sets and restricts that search parameter.

To accomplish this in APEX, I have defined application items &GL_FIND_APP_ID and &GL_FIND_PAGE_ID which are each set to 102 and 5 respectively using application computations. These are then used in a JS function to build a URL when a KeyDown event is triggered. The values passed to the function are hardcoded in an item template, so for this approach I would need a different template for each Account Type (e.g. Asset, Expense, Liability). I don't mind this for now as I am more focused on a proof of concept. I can perhaps revisit that later to cut down on the number of templates.

The Code P1: JS Static Application Logic

function buildFieldTargets(pPage, pFields = []) {
    var vReturn = ""
    console.log('pPage: ' + pPage);
    for (i in pFields) {
        vReturn += ",P" + pPage + "_" + pFields[i];
    }

    vReturn = vReturn.substring(1);
    console.log('fieldString: ' + vReturn);

    return vReturn;
}

function buildValueTargets(pValues = []) {
    var vReturn = ""

    for (v in pValues) {
        vReturn += "," + pValues[v];
    }

    vReturn = vReturn.substring(1)
    console.log('valueString: ' + vReturn);

    return vReturn;
}

function prepareURL(pUrl, pPage, pFields = [], pValues = []) {
    var vReturn = pUrl

    //Fields in auto-generated string are always forced to lower case
    vReturn = vReturn.replace('field_target', buildFieldTargets(pPage, pFields));
    vReturn = vReturn.replace('VALUE_TARGET', buildValueTargets(pValues));

    return vReturn
}

function lookUpGL(pFields = [], pValues = []) {
    var vUrl = "f?p=&GL_FIND_APP_ID.:&GL_FIND_PAGE_ID.:&APP_SESSION.:::&GL_FIND_PAGE_ID.:field_target:VALUE_TARGET";
    var vPage = '&GL_FIND_PAGE_ID.'

    console.log('Default URL: ' + vUrl);

    vUrl = prepareURL(vUrl, vPage, pFields, pValues);

    console.log('Prepared URL: ' + vUrl);

    apex.navigation.redirect(vUrl);
}

The Code P2: Item Templates

<script>
    document.addEventListener("keydown", function(e) {
        console.log('KeyDown Event Triggered');

        if (e.code == "F9") {
            console.log('F9 was hit.');
            document.getElementById(e.target.id + 'LOV').click();
        }
    });
 </script>

<a id= "#CURRENT_ITEM_NAME#LOV" href="javascript: lookUpGL(['ACCOUNT_TYPE'], ['EXPENSE'])" ... </a>

The Results

Working when not using static app link.

Failing when using static app link. You can see the auto-generated URL is not triggering because the substitution strings were not set.