Trouble consistently loading multiple instances of datatables
Trouble consistently loading multiple instances of datatables
I'm using Datatables to show anywhere from 8 to 16 small tables on the same page:
http://ghsfha.org/w/Special:SeasonHome?view=development&season=1985&org=GHSA&class=AAAA
More often than not the pae will load the first few tables and then stop, giving this error:
TypeError: $(...).DataTable is not a function
It would seem that if the page knows what Datatables is for the first table then it should be good to go with all the other tables.
Any thoughts on what I should be doing differently?
This question has an accepted answers - jump to answer
Answers
Hi,
Have you resolved this now - I don't get that error on the page linked to.
Allan
Thanks for checking Allan.
Unfortunately I haven't been able to resolve this yet.
I can sometimes get all the tables to render, but more than half the time it stops just midway through.
I've just reloaded it 10 times, and haven't got the error yet.
It sounds like jQuery is being loaded more than once. Could that be the case?
Allan
I assume you mean you're getting all 13 instances of Databables to load?
If so, you're having more success than I am
I can get about halfway through about half the time before I get the error, and it always gets the error in order (meaning that once one table gets the error, every table after that gets the error).
JQuery might be getting loaded more than once because Mediawiki uses JQuery 1.11.3, but I was thinking their version is loaded early and so my inclusion of JQuery 3.2.1 should overwrite it.
I don't see the Mediawiki version explicitly specified in the header with a
script
tag, and I'm not advanced enough to figure out where it might be loaded otherwise.I'll ask about Mediawiki and JQuery on Stack Overflow.
You may want to check to see if your browser is blocking something. I have had instances of an ad blocker causing issues with datatables.
I loaded your page just fine.
The problem with loading jQuery multiple times is that it does overwrite the previous instance. But it plug-ins (such as DataTables) have been attached to the previous one, then they are lost. They do not get transferred over, since they are on the prototype chain of the old one.
It sounds like your second jQuery is being loaded at some point during the course of the initialisation. It could be that I'm not seeing that as I might have more latency between me and the server than you do, hence the initialisation of the tables might complete before the second jQuery is loaded.
Interestingly, I see in the code that there is a jQuery 3.2.1 being included, but on the console if I type
$.fn.jquery
to get the version it shows 1.11.3 - so yes, I'm fairly certain that a second jQuery is being loaded and that is what is causing the issue.Can you not load 3.2.1?
Allan
I am loading 3.2.1 through Mediawiki's addHead function, which will insert custom script and style tags into the head, but Mediawiki ships with 1.11.3 and I can't quite figure out how to not load MW's default version.
I'm not really even clear on where the page is loading it since I don't see it in the page source.
Looks like it is in
load.php
.http://ghsfha.org/wiki/load.php?debug=false&lang=en&modules=jquery%2Cmediawiki&only=scripts&skin=thrust&version=1ur7vi5
Allan
Thanks, Allan.
Ok, here's the solution I've come up with, although I'm sure it cuts against Mediawiki's best practices.
1) I found Mediawiki's copy of JQuery 1.11.3 at .../wiki/resources/lib/jquery/jquery.js
2) I made a backup copy of that file
3) I blanked out the file
4) I continued to load the JQuery 3.2.1 from the header like I had been
So far I've been able to refresh the page about 20 times without a single issue.
Allan, I very much appreciate you sticking with me until I got something figured out, especially since I fully recognize this is really a Mediawiki issue.
At any rate, thanks again for the continued help and thanks for an exceptional piece of software (this and Editor!).
Loren
Thanks .
Great to hear you've got it working now!
Allan