What causes the "jqGrid is not a function" error?

Question

I have problems after the update:

• jqGrid from 3.5.3 to 3.8.2
• jquery from 1.3.2 to 1.4.4
• jquery-ui from 1.7.2 to 1.8.8

My application has jqueryui tabs. The third tab has a jqGrid control. If I do a reboot while I'm on the third tab, the grid is working correctly. However, if you reboot on the first tab, and then click the third tab, they will not appear in the grid.

Firebug shows me that the error "jqGrid is not a function".

A search on the forums indicates that the problem is with the wrong pathtojsfiles in grid.loader.js

I prefix my document.URL like this:

function jqGridInclude() { var pathtojsfiles = document.URL + "script/jqGrid/src/"; // need to be ajusted ... } 

If you set pathtojsfiles to the wrong value, you will see "file not found" errors in Firebug. All this is normal.

http://forum.jquery.com/topic/jqgrid-is-not-a-function

This thread has a dead end: @milenaa: "At first I thought it was a path problem, as I did before, but it works like this: I have a menu that calls some server controllers that return some data, or I send some data for them, When I click on the link that calls the controller, which later calls the jqgrid function, it works. But, if I call another function first, jqgrid doesn’t work. And the page includes all the js needed for both cases. Its just like another function, not allowing em jqgrid work ... but i don't know why ... "

Reading this, I think I have a similar problem. I must admit that I am not familiar with the Javascript execution model. Any ideas on how to solve or debug this?

Answer 1

I assume that you have the described problem in Internet Explorer. See the following old answer . The problem is that the method currently used in grid.loader.js does not guarantee that the included files will be executed in the exact order in which they are included and, in addition, all are executed before the jQuery(document).ready handler starts to execute. jQuery(document).ready . All downloaded files are already in the web browser cache (exactly the same as you describe with a "reload" of the page), then everything works correctly, if your code used by jqGrid cannot be executed before JavaScript jqGrid is ready.

I recommend you not include grid.loader.js. Instead, you can manually include all the files that you may need from grid.loader.js, in the same order that you can see in grid.loader.js . Another way to try is to use a workaround that I described in my answer in the trirand forum . The only limitation I know with a workaround: you cannot use XHTML code with an XML header at the beginning.