IE throws JavaScript Error: The value of the property 'googleMapsQuery' is null or undefined, not a Function object (works in other browsers)

Question

I'm having a real problem with JavaScript scope in IE 9.

This is inside the body of my document (yes, I realize script should go in the head for proper HTML, but I've never had it break a script before). The script is in the body because I don't want to mess with a shared header page for a script that is only relevant for this page:

<script type="text/javascript">
function googleMapsQuery(accountNum) {
    // function code is here (omitted for brevity)
}
</script>

This is inside a td block inside a tr block inside a tbody block inside a table block inside a form block inside the body:

<button id="google-422111" onclick="googleMapsQuery(422111)" type="button">Google This!</button>

I even moved the script block above the form just in case the order of the script function declaration was relevant (it's not).

The script works flawlessly in FireFox and Chrome, but in IE 9 (with or without compatibility view on), I get this error:

SCRIPT5007: The value of the property 'googleMapsQuery' is null or undefined, not a Function object

I studied JavaScript scope, and I cannot figure out any reason why IE thinks that 'googleMapsQuery' is a property, and why it is undefined. It's a function, and I defined it!

Answer 1

I was having a similar issue with a property being null or undefined.

This ended up being that IE's document mode was being defaulted to IE7 Standards. This was due to the compatibility mode being automatically set to be used for all intranet sites (Tools > Compatibility View Setting > Display Intranet Sites in Compatibility View).

Answer 2

I found the answer, and in spite of what I reported, it was NOT browser specific. The bug was in my function code, and would have occurred in any browser. It boils down to this. I had two lines in my code that were FireFox/FireBug specific. They used console.log. In IE, they threw an error, so I commented them out (or so I thought). I did a crappy job commenting them out, and broke the bracketing in my function.

Original Code (with console.log in it):

if (sxti.length <= 50) console.log('sxti=' + sxti);
if (sxph.length <= 50) console.log('sxph=' + sxph);

Broken Code (misplaced brackets inside comments):

if (sxti.length <= 50) { //console.log('sxti=' + sxti); }
if (sxph.length <= 50) { //console.log('sxph=' + sxph); }

Fixed Code (fixed brackets outside comments):

if (sxti.length <= 50) { }//console.log('sxti=' + sxti);
if (sxph.length <= 50) { }//console.log('sxph=' + sxph);

So, it was my own sloppy coding. The function really wasn't defined, because a syntax error kept it from being closed.

Oh well, live and learn. ;)

Answer 3

Have you tried adding the semicolon to onclick="googleMapsQuery(422111);". I don't have enough of your code to test if the missing semicolon would cause the error, but ie is more picky about syntax.

Answer 4

So I had a similar situation with the same error. I forgot I changed the compatibility mode on my dev machine and I had a console.log command in my javascript as well. I changed compatibility mode back in IE, and removed the console.log command. No more issue.

Answer 5

In my particular case, I had a similar error on a legacy website used in my organization. To solve the issue, I had to liist the website a a "Trusted site".

To do so:

• Click the Tools button, and then Internet options.
• Go on the Security tab.
• Click on Trusted sites and then on the sites button.
• Enter the url of the website and click on Add.

I'm leaving this here in the remote case it will help someone.

Answer 6

Just a few minutes ago i was facing the same problem. I got the problem that is after just placing your jQuery start the other jQuery scripting. After all it will work fine.