jQuery UI Dialog individual CSS styling
Run the following immediately after the dialog is called in the Ajax:
$(".ui-dialog-titlebar").hide(); $(".ui-dialog").addClass("customclass");
This applies just to the dialog that is opened, so it can be changed for each one used.
(This quick answer is based on another response on Stack Overflow.)
This issue turned up for me when I was trying to find a similar answer. Consider:
$('.ui-dialog').wrap('<div class="abc" />'); $('.ui-widget-overlay').wrap('<div class="abc" />');
Where abc
is the name of your 'CSS wrapper' - see Stack Overflow question Custom CSS scope and jQuery UI dialog themes where I found the answer from Evgeni Nabokov. For more information on the CSS wrapper in use with a jQuery UI dialog box - see the following (but note they do NOT really solve the issue of the CSS wrapper with the dialog box - you need the above comments to help there, Using Multiple jQuery UI Themes on a Single Page (Filament blog).