IE7和IE8的jQuery UI對話框問題

我有一個Asp.Net webforms頁面，其中包含一個隱藏的.net用戶控件（hidden.ascx），當點擊一個按鈕時，它將顯示在jQuery UI對話框中。現在，這在IE9和Chrome中運行良好。IE7和IE8的jQuery UI對話框問題

但是，在IE8中，對話框被推到頁面的底部而不是居中。

在IE7中，對話框居中但是隻讀（因爲對話框內的所有控件都是隻讀的...我也不能通過點擊右上角的'x'來關閉對話框 - 本質上整個頁面不可用，直到我刷新頁面）。

我使用jQuery的1.5.1和jQuery UI的1.8.11，並確保增加對核心，對話框，位置和窗口小部件引用。

這裏是jQuery的調用顯示隱藏的用戶控件：

$('#button').click(function(){ 
    showUserControl(); 
}); 

function showUserControl(){ 
    var d = $('#container').dialog({ 
    modal: true, 
    position: 'center', 
    autoOpen: false, 
    title: 'show .net user control', 
    width: 500, 
    show: 'puff',  
    }).height('auto'); 

    d.dialog("open"); 
}

下面是一些hidden.ascx控制（簡化爲這個職位）的：

<fieldset id="container" class="layoverForm" style="display: none"> 

    <div id="status"> 
     <asp:ValidationSummary ID="vsErrors" ValidationGroup="audit" ShowSummary="true" DisplayMode="BulletList" runat="server" /> 
    </div>  
    <div class="row"> 
     <span class="label">Choose One:<b>*</b></span> 
     <span class="control"> 
      <asp:DropDownList ID="cboPickList" ValidationGroup="audit" runat="server"></asp:DropDownList> 
      <asp:RequiredFieldValidator ID="rfvPickList" ValidationGroup="form" ControlToValidate="cboPickList" InitialValue="" Display="None" Text="*" runat="server" ErrorMessage="Please choose one."></asp:RequiredFieldValidator> 
     </span> 
    </div> 
    <div class="row"> 
     <asp:Button ID="btnSubmit" Text="Submit" runat="server" /> 
    </div> </fieldset>

正如你所看到的，真的很簡單。然而，我似乎無法找到解決這個問題的方法，所以任何幫助將非常感激。

來源

2012-08-07 gyochum

檢查z順序。 – asawyer 2012-08-07 17:06:09

對此問題的快速更新...爲了能夠在對話框中提交表單，我在定義對話框時添加了打開的事件並定義了zIndex： var d = $（'＃container' ）.dialog（{ 模態：真，位置： '中心'，的AutoOpen：假，標題： '節目達網絡用戶控制'，寬度：500， \t **開放：功能（事件，UI） {。 \t \t $（本）.parent（）appendTo（jQuery的（「形式爲：姓氏」）; \t}， \t zIndex的：3999 **，顯示： '噗'， }）高度（」。汽車'）; \t 這已經解決了我的問題與IE8，但因爲我有模態設置爲真正的IE7的問題是直到給我一個皮疹。 – gyochum 2012-08-12 15:41:37

如果我將模態設置爲false，那麼IE7可以，但顯然會使父頁可編輯，這是不好的。我想我可以做一個$ .ajax文章，而不是利用父頁面上的

問題是，在IE7中，爲了使模式正常工作，您還必須將捕獲點擊的div附加到您添加對話框div的相同位置。將$('.ui-widget-overlay').appendTo('form:first');添加到彈出窗口的openOn函數應該可以解決問題。因此，整個申報區塊將如下所示：

function showUserControl(){ 
    var d = $('#container').dialog({ 
    modal: true, 
    position: 'center', 
    autoOpen: false, 
    title: 'show .net user control', 
    width: 500, 
    show: 'puff', 
    open: function (event, ui) { 
     $(this).parent().appendTo(jQuery("form:last")); 
     $('.ui-widget-overlay').appendTo('form:first'); 
    }, 
    }).height('auto'); 

    d.dialog("open"); 
}

來源

2012-08-20 16:56:13

IE7和IE8的jQuery UI對話框問題

回答

相關問題