MediaWiki 1.16, jQuery, and MediaWiki:Common.js

Now that MediaWiki ships with jQuery, the most obvious desire is to use jQuery within MediaWiki:Common.js to control aspects of your wiki. Unfortunately, 1.16's support seems to have only been intended for MediaWiki extensions, not end-users. Thanks to some help in the #mediawiki IRC channel, there's a simple workaround. Add the following to the bottom of your LocalSettings.php:

// required for 1.16 - what about 1.17?
$wgExtensionFunctions[] = 'efAddJquery';
function efAddJquery() {
  global $wgOut;
  $wgOut->includeJQuery();
}

And you're done: now you can add jQuery to MediaWiki:Common.js. To avoid conflicts, MediaWiki renames the standard jQuery $ to $j, so you'll have to watch out for that in any scripts you write. I've not done anything huge or complicated yet, but the following snippet worked just fine for me:

$j(document).ready( function() {
  $j(".spoiler-click").click(function () {
    $j(this).next('.spoiler-data').toggle();
  });
});

You can see it in use by clicking "Show/hide guide" on http://www.disobey.com/wiki/Azkend.

Comments

Thanks for the tip. And while I should have been able to push down an array of modules into the call to $wgOut->includeJQuery(), it just didn't work, so instead, immediately after the call I made a call to $wgOut->addScriptFile( 'jquery.equalHeightColumns.min.js' ) so it all reads:

$wgExtensionFunctions[] = 'efAddJquery';
function efAddJquery() {
global $wgOut;

$wgOut->includeJQuery();
$wgOut->addScriptFile( 'jquery.equalHeightColumns.min.js' );
}

Yeah, it's a bit of a kluge, but it works well enough that I can move on to more important stuff.

Add new comment