Grid can not be used in this ('quirks') mode Error
Asked Answered
A

2

5

I want to make grid with jquery.I read data from xml. when I run it on Chrome browser it works.But when I try it on IE it gives this error.

Grid can not be used in this ('quirks') mode!

I write this code:

var datasource_url = "/Data/XML_Data.xml";

  function makeID(string) {
    return string.toLowerCase().replace(/\s/g, "_")
  }
  $(function() {
    $.loadGrid = function() {
      $.ajax({
        cache: false,
        url :datasource_url ,
        dataType: "xml",
        success: function(data, res) {

         var colNames = new Array;
          var colIDs = new Array;
          var colModel = new Array;
          var datas = new Array;
          var metadata = $(data).find("metadata").each(function() {
            $(this).find('item').each(function() {
              var colname = $(this).attr('name');
              var colid = makeID($(this).attr('name'));
              var coltype = $(this).attr('type');
              var collength = $(this).attr('length');
              var sorttype = null;
              var sortable = false;
              switch(coltype) {
                case "xs:double":
                  sorttype = "float";
                  sortable = true;
                  break;
                case "xs:string":
                default:
                  sorttype = "text";
                  sortable = true;
                  break;

              }
              colNames[colNames.length] = colname;
              colIDs[colIDs.length] = colid;
              colModel[colModel.length] = {name: colid, index: colid, width: 200, align: "center", sorttype: sorttype, sortable: sortable}
            });
          });
          var options = {
            datatype: "local",
            height: 500,
            colNames: colNames,
            colModel: colModel,
            multiselect: false,
            caption : "Data Grid",
            rowNum : 1000,
            rownumbers: true
          }
          $("#datagrid").jqGrid(options);
          $(data).find("data").each(function() {
            var i=0;
            $(this).find('row').each(function() {
              var idx = 0;
              var rowdata = new Object;
              $(this).find('value').each(function() {
                var ccolid = colIDs[idx];
                if (ccolid) {
                  rowdata[ccolid] = $(this).text();
                }
                idx++;
              })
              $("#datagrid").jqGrid('addRowData', i+1, rowdata)
              i++
            })
          })

        }
      })
    }
    $.loadGrid();
    /*
    $("#btnLoadGrid").click(function() { 
      //$(this).attr("disabled", "disabled")
      $.loadGrid();

    })
    */
  });


</script>

How can I fix this.

Abdullah answered 25/6, 2013 at 11:40 Comment(8)
Does your page have a valid doctype ?Gerstein
I think so. I use this : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">Abdullah
@3rror404 but when in IE I try to run it gives that error and I press f12 and I got this :<!-- DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" -->Abdullah
@user2328779: Use the HTML5 doctype, which should kick IE into (near) standards mode (<!DOCTYPE html> => it's also a lot easier to remember)Indulgence
@EliasVanOotegem thanks for answer but Actually I dont understand what you mean. How can I use HTML5 Doctype. what should I write and where?Abdullah
@user2328779: A doctype should be the very first thing on any HTML page, so you write it right at the top. Where you're seeing the <!-- DOCTYPE HTML PUBLIC... --> thing atm, that's where you should write <!DOCTYPE html>, that should prevent IE from kicking into quirk mode. Let me know if it worked, I'll add it as answer, thenIndulgence
@EliasVanOotegem unfortunatelly I didnt success. It gives same errorAbdullah
I find I always get that error if I have Developer Tools open. If I close Developer Tools it works fine.Explore
K
10

I recommend you to include

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

at the beginning of <head> of your XHTML document. It will switch off the "Compatibility View" for the page. Some time ago I included the line in all code examples which I found on the official jqGrid wiki (see here) because the problem which you describe is common.

Kinematograph answered 25/6, 2013 at 12:33 Comment(1)
hello, i included the above tag but i still get the errorGiule
W
1

As mentioned in the comments, you'll need a correct doctype to force IE out of quirks mode. It looks like you are using an XHTML doctype, which is not compatible with some aspects of HTML5. Try using the HTML5 doctype on the first line of your HTML page: <!DOCTYPE html>

Here's a good article on the different doctypes and their relationship to HTML5.

Wylie answered 25/6, 2013 at 12:5 Comment(1)
I replace this <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 trict//EN" "w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> with <!DOCTYPE html> But it gives same error. And when I press f12 it still says <!-- DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" -->Abdullah

© 2022 - 2024 — McMap. All rights reserved.