Javascript Error but only in Firefox 4_问答_开发者

I get the following error in Firefox 4 only (not in FF 3.6.16, Safari, Chrome, Opera or IE):

jQuery开发者_运维知识库("#list").jqGrid is not a function
   loadComplete: function(){console.log('complete');} 

myfile.js line 542

loadComplete is the last line of the jqgrid block of code (which is line 542). So it reaches the end of the call to jqgrid and then throws this error.

This is on a site that has been working fine for the past year. As soon as I upgraded to Firefox 4 I ran into this. I am certain I am loading this call to jqgrid after I load all of my other javascript (and it DOES work fine in all other tested browsers and older versions of Firefox).

What could be causing something like this? I would have thought it could be solved simply by makeing sure that the call to jqgrid was made after jquery and the jqgrid plugin were loaded but... this already seems to be the case (I even tried setting a 5 second timeout on loading the bit that calls jqgrid so that everything would be certain to be loaded but it still fails). Anyway, why only in FF4?

Extra info:

Here is the order js loads on the page:

<script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/js/jquery-ui-1.8.1.custom.min.js"></script>
<script type="text/javascript" src="/js/i18n/grid.locale-en.js"></script>
<script type="text/javascript" src="/js/jquery.jqGrid.js"></script>
<script type="text/javascript" src="/js/ajaxupload.js"></script>

Then the specific view that loads the jqgrid calls at the end of the page:

<script type="text/javascript" src="/js/viewspecific.js"></script>

This last is loaded by a method in the Zend Framework that can prepend, append or offset load the file. In troubleshooting this I have explicitly used append and also the offset to force this script to load dead last. I even tried just including the raw JS at the bottom of the view script, rather than loading as a separate file but nothing makes a difference.

Any ideas on how to troubleshoot this?

The fix, courtesy Oleg, is to modify how the various included files are loaded. In the loader (jquery.jqGrid.js) you will see browser specific code like:

if(jQuery.browser.safari ) {
    jQuery.ajax({url:filename,dataType:'script', async:false, cache: true});
} else {
if (jQuery.browser.msie) {
    document.write('<script type="text/javascript" src="'+filename+'"></script>');
} else {
    IncludeJavaScript(filename);
}
}

I replaced that with a more generic:

document.writeln("<script type='text/javascript' src='"+filename+"'></script>");

and now everything loads fine in all browsers.

It seems that you use developer version of jqGrid. It includes many modules from which the jqGrid consist. The file jquery.jqGrid.js also known as grid.loader.js just include dynamically the modules in the specified order.

The problem is that there are many ways of dynamical including of JavaScript files and all from there has there advantages and disadvantages. If you just include in your page the <script> statement for all modules from jquery.jqGrid.js or all modules which you really need your program will work.

The same problem was before with IE. I suggested the fix to use document.writeln for which now included in the code of jquery.jqGrid.js on the github, but the way will be used only for IE. It seems that Firefox 4 should also use the same way. If you use <script> with jquery.jqGrid.js inside of the <head> of the HTML page, than the only disadvantage of the document.writeln method which I know is the restriction for XHTML pages: you should not include <xml> header at the beginning of the page before <!DOCTYPE ....

The best, simple and the most safe method like I wrote before is to include all modules which you need directly. I use personally only the way.