jqGrid突然停止了工作

Question

I have created an php+smarty application few years ago in which i have used jqGrid.

These are the version no : jQuery 1.2.6, jqGrid 3.2.3

It was working fine then.

Few days back when i checked it was not working. More strangely it is working on ie8 and failing on firefox and chrome browsers.

I checked through firebug console in firefox i am getting following error:

TypeError: jQuery(...).jqGrid is not a function

I am unable to understand why this error suddenly cropped up?

I have included following files:

<link rel="stylesheet" type="text/css" media="screen" href="jqgrid/themes/style.css" />
     <link rel="stylesheet" type="text/css" media="screen" href="jqgrid/themes/basic/grid.css" />
    <script src="jqgrid/js/jquery.js" type="text/javascript"></script>
    <script src="jqgrid/js/jquery.jqGrid.js" type="text/javascript"></script>
    <script src="jqgrid/js/myjqGrid.js" type="text/javascript"></script>

jqGrid code:

jQuery(document).ready(function(){
jQuery("#superadmin").jqGrid({  // Specify the ID of the Grid Table
    url:'jqgrid/superadminusers.php', // URL of PHP file
    datatype: "json", // Name of datatype
    colNames:['User Id','First Name','Last Name', 'Role', 'Contact','Edit','Delete','Status'], // Column Name in grid
    colModel:[ // Field name used in database
        {name:'username',index:'username', width:100},
        {name:'firstname',index:'firstname', width:120},
        {name:'lastname',index:'lastname', width:100},
        {name:'role',index:'role', width:100},
        {name:'phone',index:'phone', width:80},
        {name:'editrow',index:'editrow', width:50},
        {name:'deleterow',index:'deleterow', width:50},
        {name:'deletebook',index:'deletebook', width:100}
    ],
    pager: jQuery('#divPage'), // ID of Grid DIV
    rowNum:10, // Total no of rows that we want to show in grid at a time
    mtype: "POST", // method type
    height: 200, // height of grid
    width: 850, // width of grid
    multiselect: false, // set true the multiselect property
    rowList:[10,15,20], // set the number of list of rows
    imgpath: 'jqgrid/themes/sand/images', // path of images
    sortname: 'username', // column name by which grid will be sorted by default
    viewrecords: true,  // it will show the number of records below the grid
    sortorder: "asc",
  caption:'Users'
    });
});

I cannot update it to the latest jqGrid version since i have to manually change the code in all the files. Also the theme which i have used is not available in the jquery ui themes.

Answer 1

You wrote that your old web application "still work on IE8 and failing on Firefox and Chrome browsers".

I suppose it works on IE because you still use old IE8 like before, but you updated Firefox and Chrome to more recent versions as before. You use jQuery 1.2.6 which released more as 5 years ago and you use you use jqGrid 3.2.3 which released also in summer 2008. You should understand that you have to update your web application if you want use it with new modern web browsers.

If we speak about the year 2008 you should remember, that at the time Firefox 3 was just released. Internet Explorer 8 was released in 2009. Initial release of Chrome web browser was even at the end of 2008. Now we have Firefox 21 and Chrome 27. Do you really wonder that your retro application should still work in modern these web browsers?

About your code: my first experience with jqGrid was with version 3.5.2. So I am not sure how jqGrid 3.2.3 works. At least jqGrid 3.5.2 had already localisation files. So one have to insert grid.locale-en.js before jquery.jqGrid.min.js. Probably you should do the same in jqGrid 3.2.3 too?