Extend a widget, with an event handler

Extend a widget, with an event handler

Say I want to extend the dialog widget to log to console when the "focus" event is triggered. What is the proper way to do this?
  1. $.widget("my.loggeddialog", $.ui.dialog, {
  2.       // what?
  3. });
This is what I tried:  http://pastehtml.com/view/1dk326v.html
  1. $.widget("my.loggeddialog", $.ui.dialog, {
  2.     _create: function() {
  3.         $.ui.dialog.prototype._create.apply(this, arguments);
  4.         this.widget().focus(function() {
  5.             console.log("dialog focus");
  6.         });
  7.     }
  8. });
But is doesn't work properly - it seems to fire only when I click the surface of the dialog, not inner elements, and not the title bar.

Using jQuery UI 1.8

UPDATE:
OK, I found one way to do this:
  1. $.widget("my.loggeddialog", $.ui.dialog, {
  2.     _create: function() {
  3.         $.ui.dialog.prototype._create.apply(this, arguments);
  4.         this.element.bind("loggeddialogfocus", function() {
  5.             console.log("dialog focus");
  6.         });
  7.     }
  8. });
This seems to have the desired effect. Is this the recommended way to do it?