Modal jQuery dialog hidden behind overlay in ASP.net

asp.net, jquery, jquery-ui, jquery-ui-dialog, modal-dialog

Solution

I fixed it. There aren't many people who're complaining about this issue. Is it just me? Anyway, here is how I fixed it. Quite simple when you know how.

.ui-widget-overlay
{
        z-index: 0;   
}

Problem

I am developing some Jquery dialog and found the dialog was hidden when I set Modal: true. When setting Modal: false, I found everything works as expected. Hope someone can help me. ``` <asp:Button ID="btnOpendialog" runat="server" Text="Button" ClientIDMode="Static" /> <div id="dialog"> <h1>Test</h1> <asp:Button ID="btnClickfromDialog" runat="server" Text="Button" /> </div> $(function () { $("#btnOpendialog").click(function (e) { $("#dialog").dialog("open"); return false; }); $("#dialog").dialog({ height: 200, modal: true, autoOpen: false, open: function () { $(this).parent().appendTo($("form:first")); } }); }); ```

Original source