CODEWITHSUNDEEP
jqueryjquery-ui
Petra Barus
Petra Barus

Reputation: 4013

How to add listener to jQuery UI Widget Factory event on widget create?

I read in the link that we can have event handler when a jQuery UI widget is created using on.

https://api.jqueryui.com/jquery.widget/#event-create

$( ".selector" ).on( "widgetcreate", function( event, ui ) {} );

But when I tried in the JSFiddle like below, it doesn't work.

$.widget( "my.customwidget", {
    _create: function() {
        alert('Hi!');
    }
});
$('#widget').on('widgetcreate', function (event, ui) {
    alert('Hi again!');
});
$('#widget').customwidget();

The alert('Hi again!') doesn't get executed. Here's the fiddle.

Unless I do this.

$.widget( "my.customwidget", {
    _create: function() {
        this.element.trigger('widgetcreate');
    }
});

What did I do wrong?

Upvotes: 2

Views: 1525

Answers (1)

blgt
blgt

Reputation: 8215

The events are bound using the name of the widget itself, ie. "customwidget". Due to the inheritance model, you only have customwidget metadata, but not widget metadata. In your example, the name of the event is thus actually customwidgetcreate:

$('#widget').on('customwidgetcreate', function (event, ui) {
    alert('Hi again!');
});

Here's the updated fiddle: https://jsfiddle.net/2z06faLn/

There was a related question on a similar topic a while ago: Why is $(...).widget undefined?

Upvotes: 4

Related Questions