zIndex for dialog not working

zIndex for dialog not working

Hello,
I am opening a jquery dialog on click of button. There are many controls on the page. I have specified and tried many values for zIndex, but then also the dialog gets behind the other divs.

This is what I tried to set in the values for the div.
var description = 'some value';

$("#divDrawableRegion").html(description).dialog({ height: 390, width: 380, title: title,
        "buttons": [
                            {
                                text: "Close",
                                click: function () { $(this).dialog("close"); }
                            }
                        ],
        resizable: false, modal: true, autoOpen: true, overflow: scroll,
        overlay: { background: 'black', opacity: '0.9', zIndex: 10000 }
                    , position: {
                        my: 'center',
                        at: 'center',
                        of: $(document.getElementById(divId))
                    }
                });
divId is other div used in application.


In spite of specifying different values for zIndex it gets hidden and is not completely on top of other controls.

Please tell on how to do this.

Thanks