JavaScript Code works inline, but src= reference doesn't
<p>I have a javascript function that has been driving me nuts. This is the latest variation on the problem. If I put the code in line after the end of the form (i.e. after the  tag, the code works just fine; but if I put a script reference to the code, it loads but doesn't execute. </p>

<p>This works:</p>

<p>
    </p>

<pre><code>&lt;script type="text/javascript"&gt;
    var matchFieldName = 'dotmatch';
    var resultFieldName = 'dotnumber';
    var lookupURL = "/AutoSuggestJSTest/AutoSuggest.asmx/DOTFind";
    var labelFieldName = "JobTitle";
    var valueFieldName = "DOTNumber";
    $('#' + matchFieldName).autocomplete({
        source: function(request, response) {
            $.ajax({
                type: "POST",
                url: lookupURL,
                contentType: 'application/json',
                dataType: "json",
                data: JSON.stringify({ prefixText: request.term, count: 20 }),
                success: function(data) {
                    var output = jQuery.parseJSON(data.d);
                    //                        var output = eval(data.d);
                    response($.map(output, function(item) {
                        var lbl = "item." + labelFieldName + " (item." + valueFieldName + ")";
                        var val = "item." + valueFieldName;
                        return {
                            //                                label: lbl,
                            //                                value: val
                            //                                label: eval('item.' + lableFieldName + '(item.' + valueFieldName + ')'),
                            //                                value: eval('item.' + valueFieldName)
                            label: item.JobTitle + "( " + item.DOTNumber + ")",
                            value: item.DOTNumber
                        }
                    }));
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    alert(textStatus);
                }
            });
        },
        minLength: 2,
        select: function(event, ui) {
            $('#' + resultFieldName).val(ui.item.value);
            return ui.item.label;
        }
    });
&lt;/script&gt;

&lt;/div&gt;
</code></pre>

<p></p>

<p>But this doesn't:</p>

<pre><code>&lt;/form&gt;
    &lt;div&gt;

&lt;script type="text/javascript" src="js/DOTAutocomplete.js" /&gt;

    &lt;/div&gt;
&lt;/body&gt;
</code></pre>

<p>The only contents of the .js file are the lines that work.</p>

<p>ARGH!!!</p>
