Datatables not working on IE9 (chrome, firefox, opera,... ok)

Heart1010

Hi,

I have no problem with my datatable on chrome, firefox, opera,... but with IE9 I only get the "naked" html table and no datatables :(

The error console on chrome/ff don't show any errors, all looks ok. But why it's not working with IE?

How can I find the reason/debug this?!

(I use v.1.10.0)

Thanks
Hermann

Dahark

Hey,

press F12 in IE to open up the Developer Tools. Then it should show you the error and the point where it stops working.

Kind Regards

Heart1010

Tried that... but I can't see any error(s).

http://storage8.static.itmages.com/i/14/0610/h_1402390157_7515186_ad0ce6e7dc.png

Dahark

Well then you need to Debug completly through it and see what happends step by step. Without a Live sample probably nobody can tell you where the problem lies.

Heart1010

Ok, here is an example page to demonstrate it http://ebbe.genobank-hotline.de/datatables_ie9_error.html

This example page works on chrome, firefox, opera,... but not with IE9 here.

Dahark

Well, this may be a long shot, but I get the following when running in IE9 Mode (I'm using IE 11):
HTML1521: Unerwartete "</body>"-Markierung oder Dateiende. Alle geöffneten Elemente sollten vor dem Ende des Dokuments geschlossen werden.
Datei: datatables_ie9_error.html, Zeile: 213, Spalte: 3

I've had a look at your HTML and you have 2 DIVs that aren't closing:

<div class="container">
  <div class="starter-template">

The IE is a very big "Korinthenkacker" ;-).
Or ist this only a problem in the testcase you set up?

Heart1010

you are right about that missing two div closes, I updated the example page (and live page) but that wasn't the reason it's not working in IE9. Still have this IE9 problem :(

Dahark

Hey,

I found the Problem.

              "language":         {
                  "url":          "//cdn.datatables.net/plug-ins/28e7751dbec/i18n/German.json"
                                  }

When you change it to:

              "language":         {
                  "url":          "dataTables.german.lang"
                                  }

now it should also work in IE9

Heart1010

Strange... when I copy the german.lang to my ftp folder and load it as you've shown datatable isn't working in any broswer!? When I totally delete the language part it's working (also in IE9).

So why datatable isn't working with this local lang file? (no error in cosole)

I've updated the example url above.

Dahark

Hey,

please try it exactly as I have shown it without /lib/. Just put in:

"url" : "dataTables.german.lang"

I've tested this on live.datatables.net and there it works:
http://live.datatables.net/qaduzor/1

Heart1010

your table shown in the live.datatables.net url don't work here. When I open the console I see the error "GET http://live.datatables.net/dataTables.german.lang 404 (Not Found)" for example.

(and also when I put that dataTables.german.lang here on my ftp root (so I don't get that 404 error) it isn't working...)

(Otherwise, when I don't use the url param but write every string in that language sequence it's working.)

Dahark

Ok, I'm sorry. I yesterday believed it worked for me, strange it doesn't anymore now.

Alternative:

"language" : {
    "sEmptyTable":      "Keine Daten in der Tabelle vorhanden",
    "sInfo":            "_START_ bis _END_ von _TOTAL_ Einträgen",
    "sInfoEmpty":       "0 bis 0 von 0 Einträgen",
    "sInfoFiltered":    "(gefiltert von _MAX_ Einträgen)",
    "sInfoPostFix":     "",
    "sInfoThousands":   ".",
    "sLengthMenu":      "_MENU_ Einträge anzeigen",
    "sLoadingRecords":  "Wird geladen...",
    "sProcessing":      "Bitte warten...",
    "sSearch":          "Suchen",
    "sZeroRecords":     "Keine Einträge vorhanden.",
    "oPaginate": {
        "sFirst":       "Erste",
        "sPrevious":    "Zurück",
        "sNext":        "Nächste",
        "sLast":        "Letzte"
    },
    "oAria": {
        "sSortAscending":  ": aktivieren, um Spalte aufsteigend zu sortieren",
        "sSortDescending": ": aktivieren, um Spalte absteigend zu sortieren"
    }
}

This is the content of the json file that is being provided by DataTables. It's a work around, but when you put it like this, it should work in every Browser.

Heart1010

Yes.... as I wrote

(Otherwise, when I don't use the url param but write every string in that language sequence it's working.)

That way it works... strange that the url param doesn't work.

Thanks for your patience ;)!

Dahark

Haha ok...I overread that line, I'm sorry.

Yeah, I don't know what the problem is. I guess IE9 has a problem with the JSON File itself.

Heart1010

When using the url param (with the lang file on my ftp server) it doesn't work on any broswer! That's the strange thing...

Darkenspirit

Check your JSON headers
IE9 refuses to read JSON objects and does nothing with it unless they're charset is specifically "utf-8"

I dont know nor understand the implications since it is in german langtype but you might need a different charset than mine, the important part to notice is the "-" previously i had charset="utf8" and IE9 murdered the JSON Object and refused to do anything with it despite a proper HTML response of 200 and the dev tools being able to open and view the json file.

http://www.wekeroad.com/2011/10/24/a-fun-little-json-murder-mystery-with-ie9/

Heart1010

@Darkenspirit Can you describe what to do exactly? Problem here is not only IE9 but when using the url param with a local (ftp) lang file in general. When I do that NO browser shows datatable.

It only works when using url param with //cdn.url (works in every browser except IE) or writing the strings directly in language section (works in every browser).

Darkenspirit

If you are on Chrome, open up Chrome Dev tools with F12 and look at network. Your JSON object should come through there and you can inspect the object itself.

Same in IE except you have to tell the network to start logging network activity first.

Example: http://i.imgur.com/k4F1e9W.jpg