2

我有一个 div,上面有一些我想弹出给用户的东西,所以他们必须在提交之前同意:

<div id="terms" style="display:none">
        <p style="font-weight:bold">If your data is not backed up in advance, you may have to forfeit your booked slot and rebook the handover on another date.</p>
        <asp:CheckBox ID="cbTerms" ClientIDMode="Static" CssClass="error" Style="font-size:0.8em" Text =" I understand the above, and will ensure my data is backed up prior to the handover date" runat="server" /> 
        <p style="text-align:right"><asp:Button ID="btnSubmit" ClientIDMode="Static" runat="server" Text="Submit" OnClick="btnSubmit_Click" Enabled="False" /></p>
    </div>

我正在使用 jQuery UI 对话框来实现这一点:

    $('#terms').css('visibility','block');
    $('#terms').dialog({ 
           modal: true, 
           width: '500px', 
           title: 'IMPORTANT! Remember To Backup Your Laptop', 
           open: function (event, ui) { 
                 $('.ui-dialog-titlebar-close').hide(); 
                 $(this).parent().appendTo('form'); }, 
     });

如果我遗漏:

$(this).parent().appendTo('form'); }

该按钮不会触发,因为它已在表单之外。

但是,当我将其放入以使按钮起作用时,该表单出现在模态叠加层的后面并且无法单击。

我正在使用母版页 - 不确定这是否相关。

4

2 回答 2

1

我会将对话框添加到文档节点,并将事件处理程序添加到调用form.submit().

于 2013-06-28T14:48:37.380 回答
0

这似乎只发生在最新版本的 JQuery 中并且如果您使用 append 选项。

不幸的是,当控件在 UpdatePanel 中时从 JQuery 提交表单会导致整个页面刷新。

此代码段将允许您将对话框附加到表单,并通过在叠加层和对话框上设置 z-index 将叠加层保留在其后面。

open: function (type, data) {
                $('.ui-dialog').css('z-index', 103);
                $('.ui-widget-overlay').css('z-index', 102);
                $(this).parent().appendTo("form");
            }
于 2013-08-24T13:48:59.403 回答