Access Functions Between Two External Javascript Files
<p>I have a pretty JavaScript-heavy site that I'm working on, so to try and keep the code a little more under control, I tried to group my code into several logical external JavaScript files (.js files). For the most part it works just fine, but for some reason one function located in the file <code>viewer.js</code> file does not like being called from the <code>ajax.js</code> file (in other words, it's not - the Firebug console tells me <code>nb_displayError is not defined</code> (where the function in question is <code>nb_displayError()</code>.</p>

<p>I tried placing the <code>viewer.js</code> script tag both above and below my <code>ajax.js</code> script tag in my HTML file, but neither seemed to make a difference. Strangely, I can call functions in my <code>ajax.js</code> file from another JavaScript file but this one in particular fails. Any thoughts as to why?</p>

<p>In case it's useful to you, the function calling creating this issue is defined as the following (I don't think it's anything particularly tricky):</p>

<pre><code>function populateZoomLevel() {
    var model = $('#modtype').children(':selected').text();
    var lat = $("#loc-label").data('location').latitude;
    var lon = $("#loc-label").data('location').longitude;

    $.get("checkDomains.php", { result: 'zoomlevel', lat: lat, lon: lon, model: model })
        .done(function(responseText){
            if(responseText.substring(0, 7) == "error: "){  // Error flag
                nb_displayError(responseText);
                return;                          // Don't do anything further
            }

            $('#zoomlevel').html(responseText);
        });
}
</code></pre>
