dialog is not showing overlay

dialog is not showing overlay


I've a page with several dialog forms on it. Some of them load the
content with an ajax call and some have static content.
My dialog with the dynamic content correctly shows the overlay, but
the other dialogs do not show the overlay.
here are my dialog options for the dynamic content:
var dialogOptions = {
height: 315,
width: 600,
title: "Add To Schedule",
buttons: {
"Submit": function() {
log("submit button");
var dialog = this;
FacilityAdmin.submitForm('#resident-add-playlist', function
(modelState) {
log("add playlist form callback");
FacilityAdmin.Scheduling.displayScheduledPlaylists
(modelState.Data, { onDelete:
FacilityAdmin.Scheduling.deleteResidentPlaylist });
updateComments();
$(dialog).dialog("destroy");
$('#dialog').remove();
});
},
"Cancel": function() { $(this).dialog("destory"); $
('#dialog').remove(); }
}
};
and here is one for the static content:
$('#resident-comment').dialog({
autoOpen: false,
title: "Add Note",
overlay: { opacity: .8, background: "gray" },
width: 450,
buttons: {
Cancel: function() { $(this).dialog("close"); },
Submit: function() {
FacilityAdmin.submitForm('#comment-form', function
(modelState) {
$('#resident-comment').dialog("close");
location.reload();
});
}
}
});
is there something obvious I'm missing?
Thanks,
John