Odd jQuery 'undefined' issue

Report · Jun 01, 2020

Hello, all,

I've got a weird situation that's got me scratching my head.

I've got a form page, which includes an older version of jQuery (1.11.2) at the top of the page. Near the bottom of this page I am CFINCLUDING a .js file. Works great.

Tried updating to jQuery 3.5.1, and suddenly this included .js file breaks, stating that "'$' is undefined on line 11." But $ is being used on at least seven lines prior to line 11.

$('#thisForm').css({..});  /*  THESE lines don't break  */
$('#thisForm').attr(...);
...
function ums(val){
    switch(val){
        case 'a': case 'b': case 'c':
            $('#thisForm').css({...});  /*  THIS is the line that breaks */
        break;
        default: break;
        }
ums($('#thisSelect').val());  /*  Triggered by this line  */

Totally stumped on this one. Ideas?

V/r,

^ _ ^

Report · Jun 01, 2020

Strange. Does this fare any better:

case 'a': 
case 'b': 
case 'c':           
$("#thisForm").css({...});

Report · Jun 02, 2020

No change.

V/r,

^ _ ^

Report · Jun 03, 2020

Hmm, so it's unlikely to be syntax, and likely to be the JQuery URL. I would go old-school, and test each of the following URLs in turn:

<!--- URLs to test --->
<!---
https://code.jquery.com/jquery-3.5.1.js
https://code.jquery.com/jquery-3.5.1.min.js
https://code.jquery.com/jquery-2.2.4.js
https://code.jquery.com/jquery-2.2.4.min.js
--->
<html>
<head>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js" type="text/javascript">
    </script>
</head>
<body>
</body>
</html>

Report · Jun 03, 2020

Unfortunately, I can't do that.

Firstly, because we are not allowed to use CDNs.

Secondly, because the code I'm working on exists on our encrypted network, which does not have access to the internet.

I'd have to download all the previous versions to disk, xfer them to the network, and try that.

V/r,

^ _ ^

Report · Jun 03, 2020

Oh, of course. You've said really.

I should remember strait-jackets are mandatory where you work. 😉

In any case, copying the Javascript to your local machine is good, too.

You could add, for testing purposes:

Does Javascript path exist? <cfoutput>#fileExists(absolute_path_to_Javascript_file)#</cfoutput>

Report · Jun 03, 2020

Yeah, it's caused me to really think outside the box. But, I can proudly state that I have been able to deliver on about 95% of what I've been tasked to do. The remaining 5%, well, let's just say I'm not happy about telling the customer it can't be done under the circumstances. Neither are they.

The path to the file exists, because at least _some_ processing is being done. I just can't understand why it exists for some of the code, but then mysteriously disappears for one line. It makes no sense.

V/r,

^ _ ^

Report · Jun 03, 2020

Wow, necessity is indeed the mother of invention. 95% delivery puts you way, out there, ahead of the field! Hats off.

Report · Jun 03, 2020

I would next check the scope of functions. That is, verify whether they start ({) and end (}) properly.

Report · Jun 03, 2020

@WolfShade: Near the bottom of this page I am CFINCLUDING a .js file.

A likely cause of the problem. Mixing JS and CFML idioms might mess up the order in which the Javascript is delivered to the page.

This shouldn't be a problem:

<head>
    <script src="path/to/jquery-3.5.1.min.js" type="text/javascript">
    </script>
</head>

Report · Jun 03, 2020

This.

It hadn't occurred to me that to CFINCLUDE a .js file might be the culprit. Still doesn't explain why it works with v1.11.2, but next time I'm in the office, this will be the very first thing I look into.

Not sure when that next time will be, but I'll arrange something with a co-worker. He can push files to production, but for some reason can't test anything, so we both have to be in the office at the same time. 🙂

V/r,

^ _ ^

Report · Jun 03, 2020

The change in version from jQuery 1.11.2 to jQuery 3.5.1 is huge. We should therefore expect "breaking" changes.

Adobe Community

Odd jQuery 'undefined' issue