jQuery widget has no method "extend"

Question

I'm working on a Wordpress site which contains a number of jQuery and jQuery UI-dependent plugins. Everything seemed to be working fine, but when we moved over the entire site to the new domain name, I started seeing the following error in the Chrome console:

Uncaught TypeError: Object function (b,c,d){var e=b.split(".")[0],f;b=b.split(".")[1],f=e+"-"+b,d||(d=c,c=a.Widget),a.expr[":"][f]=function(c){return!!a.data(c,b)},a[e]=a[e]||{},a[e][b]=function(a,b){arguments.length&&this._createWidget(a,b)};var g=new c;g.options=a.extend(!0,{},g.options),a[e][b].prototype=a.extend(!0,g,{namespace:e,widgetName:b,widgetEventPrefix:a[e][b].prototype.widgetEventPrefix||b,widgetBaseClass:f},d),a.widget.bridge(b,a[e][b])} has no method 'extend'

Here is the line in jQuery UI 1.9.3 that seems to be causing this:

this.options = $.widget.extend( {},
this.options,
this._getCreateOptions(),
options );

I can't seem to get past this at all, no matter what I tried to do. I'm using the proper method (or so I've read) to add scripts by using wp_enqueue_script() and setting jquery as a dependency of jquery-ui, and looking at the HTML, jQuery is indeed loading before jQuery UI.

If anyone has any idea of what might be happening I would really appreciate it, this is driving me nuts.

Answer 1

This isn't the answer to your problem, but to illustrate, sometimes it looks like you are having a jQuery error when you are actually having an error with your custom javascript.

If you are using Chrome, you can open the console (Tools > Javascript console) and twirl the small arrow open on your error. This will show you all the lines of code that caused the error.

See image:

Often if you look down the list it will lead to another javascript other than jQuery. If you click on the black links on the right (i.e. activity.php) it will open up the offending lines if it is javascript.

Another problem (if you are using Wordpress) is that you might be loading jQuery twice. It sounds like you did it the right way, however, it's possible that one of your plugins did not.

Edit What version of jQuery are you running (sorry misread jquery ui)

From the documentation: Ninja Forms uses the version of jQuery (the javascript library) that comes packaged with WordPress. This means that if you are using an external jQuery file, or another plugin is loading its own version of jQuery, errors may arise. For example, if you are using WordPress version 3.3 or higher, Ninja Forms expects that your site will have version 1.7 of jQuery. If you have a theme or plugin which changes this to an earlier version of jQuery, Ninja Forms may not work properly.