There's a problem using scoped themes with jQuery UI's Dialog widget in the 1.6 and 1.7 releases (and possibly 1.7.1 as well).
Christoph Herold mentioned his workaround - wrapping the dialog's DOM with a scoping div (with the scoped theme's class name). I wrote a small jQuery plugin that does this and works fine so far:
// Wraps the dialog in a div with the scoping class on // dialog open, removes the scoping class on dialog close $.fn.dialogScopingWorkaround = function(scopingClass) { this.bind('dialogopen', function(event, ui) { $(this).parents(".ui-dialog").wrap( '<div class="dialogScopingWrapper ' + scopingClass + '"></div>' ); }); this.bind('dialogclose', function(event, ui) { var wrapper = $(this).parents(".dialogScopingWrapper"); wrapper.replaceWith(wrapper.children()); }); return this; };
Example with the "smoothness" theme scoped with class "theme-smoothness":
$('#dialog').dialogScopingWorkaround("theme-smoothness").dialog(); // Must call the workaround before opening the dialog // so the 'dialogopen' event is bound.
No comments:
Post a Comment