Customise jquery model window

Question

i have used to get the jquery dialog and it is also works fine, but i don't want to give the user option to close it since i close it pragmatically .

following is the code to pop up the dialog

<div id="emailNotification" title="Email Notification">
                                                <p>Please Wait Email is being sent....</p>
                                                      </div> 

and this is how i close;

$("#emailNotification").dialog('close');

There is close option at the right side which i don't want, how to disable this in jquery.

Please help

Answer 1

The way I have done this in the past is to override the CSS jQUery-UI declaration to hide the close button. By sub-classing the specific CSS, you can create separate instances that either require a close button, or don't.

Off the top of my head, I think the specific CSS looks something like this...

.ui-dialog .ui-dialog-titlebar-close {
    display: hidden;
}

In a similar manner, having a thorough understanding of the jQuery-UI CSS will also allow you to customize the "look and feel" of dialogs, tabs, and so on, so you can use different styles, add background images, etc.

Answer 2

Thanks for all your comments ans answers.

The following has resolved my problem.

 $("#emailNotification").dialog({
        closeOnEscape: false,
        open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); }
});