jqgrid IE 8/7 Performance

Question

have implemented jqgrid onto a page of our web application. Everything works as in showing records and removing records but when I put IE compatibility mode into IE 7 or 8 It takes 3 to 5 seconds before it showing the grid. I am also only showing one record.

I am using jquery 1.6 and have tried upgrading to the latest version which makes no difference. One thing i have noticed is jquery calling a function called clean which look to be taking 3 second for only these browsers but I have no idea why or what its doing.

                    var id = $("#<%=DesID.ClientID%>").val();
            $.getJSON("data.aspx?id=" + id, function (data) {

                jQuery("#list2").jqGrid({
                    datatype: 'jsonstring',
                    colNames: ['', 'Id', 'BodyId', ' Officers Body', 'Alternative Responsible Officer', ''],
                    colModel: [
                    {
                        name: 'RowID',
                        sortable: false,
                        shrinkToFit: false,
                        width: 10,
                        formatter: function (cellvalue, options, rowObject) {
                            var Rowid = options.rowId;
                            return "<span >" + Rowid + " </span>";

                        }
                    },
                    { name: 'Id', index: 'Id', width: 0, hidden: true, sortable: false },
                    { name: 'BodyId', index: 'BodyId', sortable: false, width: 0, hidden: true },
                    { name: 'BodyName', index: 'BodyName', sortable: false, shrinkToFit: true },
                    { name: 'BodyNameRo', index: 'BodyNameRo', sortable: false, width: '100%' },
                    {
                        name: 'Delete',
                        sortable: false,
                        shrinkToFit: true,
                        width: 20,

                        formatter: function (cellvalue, options, rowObject) {
                            var Rowid = options.rowId;
                            return "<input type='button'  value='Delete' class='btn' onClick='deleteRecords(" + Rowid + " );' />";

                        }
                    }
                ],
                    beforeSelectRow: function (rowid, e) {
                        return false;
                    },
                    onInitGrid: function () {
                        // get reference to parameters
                        var p = $(this).jqGrid("getGridParam");

                        // set data parameter
                        p.datastr = data;
                    },
                    viewrecords: true,
                    caption: "",
                    autowidth: true,
                    shrinkToFit: true,
                    height: '100%',
                    scroll: false,
                    gridview: true,
                    loadOnce: true
                });

                HiddenJson.val(JSON.stringify(data));

    });

There are many strange things in your code. `colModel` have for example **two** columns with the same name: `name: 'actions'`. It's an error. You use `sortname: 'id'`, bot no `'id'` column exist in the grid. It's unclear why you use `datatype: 'jsonstring'` instead of `datatype: 'local'`. About your main question: I use `` in all my grids. Why you could need to simulate IE8 or IE7 and use any other `"X-UA-Compatible"` tag? I recommend you to read [the answer](http://stackoverflow.com/a/25532422/315935) additionally. — Oleg, Sep 10 '14 at 10:13
Tried what's recommend above and its still taking 5 secs to render the grid. I also tried local but no difference so i put i back to jsonstring. Even takes 5 seconds with no data in the grid. Is there a reason why I should not use jsonstring? — Antony Delaney, Sep 10 '14 at 10:51
The grid is doing nothing more then getting the selected items from the database from there the user can add or delete new or existing rows. As the use does this the json stored in a hidden field is updated. When the page is posted I take the json and update the data accordingly. — Antony Delaney, Sep 10 '14 at 10:54
Do you have the demo which demonstrates the performance problem? How many rows you fill in the grid? Do you tried to set `datastr: data` inside of `onInitGrid` like I described in [the answer](http://stackoverflow.com/a/25532422/315935). If `data` value of `datastr` is **object** you should have the same problem. I described the problem in [the bug report](http://www.trirand.com/blog/?page_id=393/bugs/improving-performance-of-loading-local-data-in-jqgrid#p31091) and included the timestamps in ms for the improvement which I suggested. — Oleg, Sep 10 '14 at 11:46
I have updated the question with my updates. I have tried datastr as a object and as a string with no difference. I only have 1 row. and even with no rows Its still slow. I dont have a demo to show you right now. — Antony Delaney, Sep 10 '14 at 12:07
I still don't understand your main question. You wrote "when I put IE compatibility mode into IE 7 or 8". What exactly you do? Which value of `` you use? — Oleg, Sep 10 '14 at 12:26
I Press F12 and go into Emulation and select document mode 8 and user agent string to "internet explorer 8". When I do this The grid takes 5 secs to show on the page. A lot of our clients use IE 8. I think its something I am doing as the examples on the jqgrid site are fine. Sorry for not been 100% clear. — Antony Delaney, Sep 10 '14 at 12:32

score 0 · Answer 1 · edited May 23 '17 at 10:26

0

I would recommend you to include in <head> of your page the line

<meta http-equiv="X-UA-Compatible" content="IE=edge"/>

It informs Internet Explorer don't use Compatible Mode for the page event if the default setting of Internet Explorer is using Compatible Mode. Running the page in compatibility mode makes mostly only disadvantages. Look at the documentation for more full example of HTML page and examine the headers of the demo from the answer.

edited May 23 '17 at 10:26

Community

1
1

answered Sep 10 '14 at 12:41

Oleg

220,925
34
403
798

Thanks I will try that. I just created a blank page with just he grid on and its fine. Looks like its something else on the page. – Antony Delaney Sep 10 '14 at 12:46
Just for information. I moved the script to the top of the page and the performance issue has gone. Why been at the bottom was an issue I still do not know. I will try and find out. – Antony Delaney Sep 10 '14 at 14:43
@AntonyDelaney: I'm not sure. I place all JavaScripts **always** in `` because I like clear divide the JavaScript code from HTML data. So I don't have any experience in usage of the code in the middle. By the way do you tried to use `onInitGrid` trick in your environment and **measure** the total time in ms for loading the grid? Look at [the demo](http://www.ok-soft-gmbh.com/jqGrid/performane-90000__.htm) the lines `startTime = new Date();` and `alert(new Date() - startTime);`. Gives the trick with `onInitGrid` better performance? – Oleg Sep 10 '14 at 14:52
@AntonyDelaney: I recommend you additionally to read **UPDATED** part of [the answer](http://stackoverflow.com/a/6833082/315935). It describes the difference between loading local data with `datatype: "jsonstring"` and the usage of `datatype: "local"`. – Oleg Sep 10 '14 at 18:02

jqgrid IE 8/7 Performance

1 Answers1