In jquery UI dialog, is it possible to put a modal dialog on top of another modal dialog

Question

I have a modal dialog using jquery UI dialog. I now want to popup another dialog when i user changes a field in the first dialog. Both should be modal.

Is this po

Answer 1

Just wanted to let future finders know. It is possible to use z-index to put a modalWidget over another. I'm using jquery ui 1.10.3.

The way you go about it is, you give your dialog constructor a dialog class.

$("#secondModalDialog").dialog({
    title: 'Title',
    dialogClass: 'ModalWindowDisplayMeOnTopPlease',
    width: 200,
    height: 200
});

Then in your CSS, you specify a higher z-index than the first dialog is using.

.ModalWindowDisplayMeOnTopPlease {
    z-index: 100;
}

You may need to check which one its using with firebug or some dev tool to check which z-index it was instanced with. My default z-index was 90 on the first modal Widget. The window code looked smthg like this: