Widget: this._on delegates using instance.widget() instead of passed element

[shuoink]

I have a somewhat complex widget that has multiple drop-down menus that are placed directly under the body tag. I expected to be able to do the following:

this._on(this._menu, {'click button': '_menu_button_click'});

... but this doesn't work and actually causes a good bit of chaos. Every button element in the entire widget (except the desired one) is now bound to _menu_button_click. This happens because in $.Widget.prototype._on, it only uses the passed element if there's no selector specified. Here's that code:

if ( selector ) {
  instance.widget().delegate( selector, eventName, handlerProxy );
} else {
  element.bind( eventName, handlerProxy );
}

It seems to be that it should be calling element.delegate, not instance.widget().delegate.

Am I doing something wrong?

[Scott González]

We can probably handle this by checking if an element was passed and if so using that.

[shuoink]

Just committed a fix and submitted a pull request:

​https://github.com/jquery/jquery-ui/pull/776

[Jörn Zaefferer]

Widget: Fix _on to use element argument for delegated events. Fixes #8658 - Widget: this._on delegates using instance.widget() instead of passed element

Changeset: 721a4b4ae027b140ca280bbc8fb8ed334081b184