jQuery UI Dialog - set a default config

Question

I have several jQuery UI Dialogs handlers, all of which contain the following:

open: function(event, ui) {
      $(".ui-dialog-titlebar").removeClass("ui-corner-all");
      $(".ui-dialog").removeClass("ui-corner-all");
},

This is so that the dialog has square corners, rather than round ones. I was wondering if it's possible to have this set as default, so that I don't have to insert this code into every dialog config on the page.

I know I can edit the CSS, but it makes more sense to actually remove the class if it's not needed.

Answer 1

I know it's not perfect, but you could define your own defaults object that contains your defaults. Then if you need to override or add to those defaults, you could use $.extend:

var dialogDefaults = {
    open: function (event, ui) {
        $(".ui-dialog-titlebar").removeClass("ui-corner-all");
        $(".ui-dialog").removeClass("ui-corner-all");
    }
};
// then later on:
$("#foo").dialog($.extend({ }, dialogDefaults, {
    autoOpen: false,
    width: 500,
    /* etc... */
}));

Also remember that for the events, you can bind to them outside of the options object by using on (or its siblings delegate, bind, and live). You can apply that event handler to multiple dialogs by applying the same class to all of your dialogs, for example:

$("div.my-dialog-class").on("dialogopen", function (event, ui) {
    $(".ui-dialog-titlebar").removeClass("ui-corner-all");
    $(".ui-dialog").removeClass("ui-corner-all");
});

Just keep in mind that this event handler won't fire off for new dialogs. You could let the event bubble up the DOM to the body and attach the event handler there (this is the route I would go):

$(document.body).on("dialogopen", "div.my-dialog-class", function (event, ui) {
    $(".ui-dialog-titlebar").removeClass("ui-corner-all");
    $(".ui-dialog").removeClass("ui-corner-all");
});

With this method of event delegation, you are applying your open function to all dialogs that will ever be appended to document.body.