Trouble consistently loading multiple instances of datatables

Trouble consistently loading multiple instances of datatables

Loren MaxwellLoren Maxwell Posts: 387Questions: 94Answers: 10

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

  • allanallan Posts: 61,840Questions: 1Answers: 10,134 Site admin

    Hi,

    Have you resolved this now - I don't get that error on the page linked to.

    Allan

  • Loren MaxwellLoren Maxwell Posts: 387Questions: 94Answers: 10

    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.

  • allanallan Posts: 61,840Questions: 1Answers: 10,134 Site admin

    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

  • Loren MaxwellLoren Maxwell Posts: 387Questions: 94Answers: 10

    I assume you mean you're getting all 13 instances of Databables to load?

    If so, you're having more success than I am :smile:

    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.

  • indymxindymx Posts: 63Questions: 3Answers: 0

    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.

  • allanallan Posts: 61,840Questions: 1Answers: 10,134 Site admin

    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

  • Loren MaxwellLoren Maxwell Posts: 387Questions: 94Answers: 10

    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.

  • allanallan Posts: 61,840Questions: 1Answers: 10,134 Site admin
    Answer ✓
  • Loren MaxwellLoren Maxwell Posts: 387Questions: 94Answers: 10

    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

  • allanallan Posts: 61,840Questions: 1Answers: 10,134 Site admin

    Thanks :).

    Great to hear you've got it working now!

    Allan

This discussion has been closed.