How to subclass a specific jqueryui widget method?

Question

Since I updated jQueryUI to 1.8 I found a couple of issues in our implementations and I could fix it myself without waiting for a fix on their end if I could find out how to subclass a specific method of the datepicker widget so I call the parent code and then execute my code.

I was reading on $.widget but I just can't wrap my head around how that is suppose to work.

I tried something like this:

$.widget("ui.datepicker", {
  _showDatepicker: function(input) {
   alert('Yo');
   $.datepicker.prototype._showDatepicker.apply(this,arguments);
   alert('Hey!');
  }
 });

And all sorts of other variations and beging to think I just don't understand the 'extendability' of jQueryUI or it just can't be done.

Anybody knows how I can achieve this ?

Thx

Answer 1

The datepicker in 1.8 doesn't use the widget factory. The other widgets do but the datepicker hasn't been refactored to use the widget factory yet, something that will happen for a later version of jQuery UI.

You can do something like for the datepicker:

var old_showDatepicker = $.datepicker._showDatepicker;
$.datepicker._showDatepicker = function(input){
    console.log('hello');
    old_showDatepicker.apply(this,arguments);
    console.log('goodbye');
}

And this for the slider:

$.widget("my.slider", $.ui.slider, {
    _value: function(input) {
        console.log('Yo');
        $.ui.slider.prototype.value.apply(this,arguments);
        console.log('Hey!');
    }
});