2012-01-27 145 views
0

我继承了一些使用ASP模式弹出式扩展程序的代码,并且由于某些原因,它现在决定停止工作。我在这里错过了什么吗?我现在不太流利地使用AJAX/ASP.Net,所以我正努力诊断这里出了什么问题。模态弹出式扩展程序不显示弹出式菜单

所以,首先显示的模式

function ShowModalRemoveEvent(ID, EventID, InstructorID, InstructorName) 
     { 
     alert("Hi"); 
     var modal = $find('ModalPopupExtender1'); 
     modal.show(); 
     document.getElementById("txtID").value = ID; 
     document.getElementById("txtEventID").value = EventID; 
     document.getElementById("txtInstructorID").value = InstructorID; 
     document.getElementById("txtInstructorName").value = InstructorName; 
     } 

我知道这是被称为由于警报的JavaScript方法。所以我会假定这个标记是在找到ModalPopupExtender1或者modal.show()这一行。

这里是我的模态弹出扩展

<asp:UpdatePanel ID="UpdatePanel4" runat="server" UpdateMode="Conditional"> 
     <ContentTemplate> 
     <asp:Panel ID="Panel4" runat="server" Style="display: none" CssClass="ModalBackground"> 
      <table style="width: 100%" border="0" cellpadding="0" cellspacing="0"> 
       <tr> 
        <td width="7%" class="cellAlertHeader"> 
        <img src="../../../images/Ops/window_delete.png" style="width: 18px; height: 18px" alt=""/> 
        </td> 
        <td width="93%" class="cellAlertHeader"> 
        <b>Cancel Instructor Event</b> 
        </td> 
       </tr> 
      </table> 
      <table width="100%"> 
       <tr> 
        <td width="5%"> 
        &nbsp;<td width="95%"> 
         &nbsp; 
         <asp:TextBox ID="txtID" Style="display: none" runat="server" CssClass="TextboxTitle"></asp:TextBox> 
         <asp:TextBox ID="txtEventID" Style="display: none" runat="server" CssClass="TextboxTitle"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td width="5%"> 
        &nbsp; 
        </td> 
        <td width="95%"> 
        <asp:TextBox ID="txtInstructorID" Style="display: none" runat="server" BorderStyle="None" 
         CssClass="TextboxTitle"></asp:TextBox> 
        <asp:TextBox ID="txtInstructorName" Style="font-size: 12px" runat="server" BorderStyle="None" 
         CssClass="TextboxTitle" BorderWidth="0"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td width="5%"> 
        &nbsp; 
        </td> 
        <td width="95%"> 
        &nbsp; 
        </td> 
       </tr> 
       <tr> 
        <td width="5%"> 
        &nbsp; 
        </td> 
        <td width="95%"> 
        <asp:Label ID="Label2" runat="server" Text="Are you sure you want to remove this Event?" 
         CssClass="TextboxTitle"></asp:Label> 
        </td> 
       </tr> 
       <tr> 
        <td width="5%"> 
        &nbsp; 
        </td> 
        <td width="95%"> 
        &nbsp; 
        </td> 
       </tr> 
       <tr> 
        <td width="5%"> 
        &nbsp; 
        </td> 
        <td width="95%"> 
        <asp:Button ID="ButtonConfirmRemove" runat="server" Text="Confirm" CssClass="buttonshort" /> 
        <asp:Button ID="ButtonCancel" runat="server" Text="Cancel" CssClass="buttonshort" /> 
        </td> 
       </tr> 
       <tr> 
        <td width="5%"> 
        &nbsp; 
        </td> 
        <td width="95%"> 
        &nbsp; 
        </td> 
       </tr> 
      </table> 
     </asp:Panel> 
     <asp:Button runat="server" ID="dummyButton" Style="display: none" /> 
     <cc1:ModalPopupExtender ID="ModalPopupExtender1" 
           runat="server" 
           PopupControlID="Panel4" 
           TargetControlID="dummyButton" 
           BackgroundCssClass="ModalBGOpacity" 
           CancelControlID="ButtonCancel" 
           OnCancelScript="HideModalPopup()"> 
     </cc1:ModalPopupExtender> 
     </ContentTemplate> 
     <Triggers> 
     <asp:AsyncPostBackTrigger ControlID="dummyButton" /> 
     </Triggers> 
    </asp:UpdatePanel> 
+0

也许你添加一个库,如jQuery /原型和符号$改变工作方式。 – Aristos 2012-01-27 12:37:21

+0

@Aristos好主意,我检查了母版页,除了用于模态弹出框的javascript文件 – Purplegoldfish 2012-01-27 12:54:49

+1

之外,我们没有包含任何库,这里的第二个问题是检查模式ID如何在html代码上呈现。是ModalPopupExtender1还是其他方式,您需要添加ModalPopupExtender1.CliendID以获取呈现的ID。如果你在母版页客户端添加这个代码,那么这个ID现在有变化 – Aristos 2012-01-27 12:58:11

回答

2

尝试让你控制的渲染ID,这样的代码。

var modal = $find('<%=ModalPopupExtender1.CliendID%>');