Ajax Modalpop up error - ajax

Question

I have added a modal popextender
when i click on Edit button i ma getting following error.
Unhandled exception at line 1, column 55504 in http://localhost:59846/bundles/MsAjaxJs?v=c42ygB2U07n37m_Sfa8ZbLGVu4Rr2gsBo7MvUEnJeZ81
0x800a138f - JavaScript runtime error: Unable to get property '_events' of undefined or null reference
If there is a handler for this exception, the program may be safely continued.
Unhandled exception at line 1, column 55504 in http://localhost:59846/bundles/MsAjaxJs?

Answer 1

I have two pages View.aspx and AddEdit.aspx
On click of Edit button of View.aspx , Another page AddEdit.aspx in Modalpopup should be opened.
I am using AjaxControlTookit version 15.1.3.0
View.aspx
<%# Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="View.aspx.cs" Inherits="TransitionAutomationPlatform.WebApp.Templates.ContractSummaryNote.View" %>
<%# Register Src="../../UserControls/ucProcessInfo.ascx" TagName="ucProcessInfo" TagPrefix="uc1" %>
<%# Register Src="../../UserControls/ucGridActions.ascx" TagName="ucGridActions" TagPrefix="uc2" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<style type="text/css">
.DarkenBackground {
background-color: rgb(0, 0, 0);
opacity: 0.7; /* Safari, Opera */
filter: alpha(opacity=70); /* IE */
z-index: 20;
height: 100%;
width: 100%;
background-repeat: repeat;
position: fixed;
top: 0px;
left: 0px;
}
.ModalPopup {
background-color: #003e74;
filter: alpha(opacity=100); /* IE */
font-family: Verdana;
border-style: solid;
border-width: 0.75pt;
border-color: White;
}
.ModalPopup h {
background-color: #003e74;
filter: alpha(opacity=100); /* IE */
font-family: Verdana;
}
.GridViewFixedHeader {
position: relative;
color: White;
background-color: #646464;
}
.GridScrollBar {
overflow-y: auto;
height: 200px;
width: 300px;
}
.DefaultCursor {
cursor: default;
}
.MainPageTable {
border-collapse: collapse;
padding: 0;
margin: 0;
}
.ModalTable {
height: 100%;
width: 95%;
margin-left: auto;
margin-right: auto;
}
.ModalTableLabelTD {
font-size: 8pt;
font-weight: bold;
color: White;
width: 25%;
}
.ModalTableControlTD {
width: 160px;
}
.GridViewResult {
background-color: White;
width: 282px;
padding: 20px;
}
.GridViewResultRows {
color: Black;
background-color: White;
height: 30px;
}
</style>
<link href="../../Content/jquery.dataTables.css" rel="stylesheet" />
<link href="../../Content/TableTools.css" rel="stylesheet" />
<script src="../Datatables_Latest/jquery-1.11.3.min.js"></script>
<link href="../../Scripts/Datatables_Latest/jquery-ui-1.11.3/jquery-ui-1.11.3/jquery-ui.css" rel="stylesheet" />
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="../../Scripts/Datatables_Latest/jquery-ui-1.11.3/jquery-ui-1.11.3/jquery-ui.js"></script>
<script src="../../Scripts/Datatables_Latest/jquery-ui-1.11.3/jquery-ui-1.11.3/jquery-ui.min.js"></script>
<script src="../../Scripts/jquery-1.10.2.min.js"></script>
<script src="../../Scripts/jquery-ui.min.js"></script>
<script src="../../Scripts/Datatables_Latest/jquery.dataTables.min.js"></script>
<%-- <script src="../../Scripts/jquery.dataTables.min.js"></script>--%>
<script src="../../Scripts/dataTables.buttons.min.js"></script>
<script src="../../Scripts/Datatables_Latest/buttons.flash.min.js"></script>
<script src="../../Scripts/Datatables_Latest/jszip.js"></script>
<script src="../../Scripts/Datatables_Latest/jszip.min.js"></script>
<script src="../../Scripts/Datatables_Latest/pdfmake.min.js"></script>
<script src="../../Scripts/Datatables_Latest/vfs_fonts.js"></script>
<script src="../../Scripts/Datatables_Latest/buttons.html5.min.js"></script>
<script src="../../Scripts/General.js"></script>
<script src="../../Scripts/JsTemplates/ContractSummaryNote.js"></script>
<div>
<uc1:ucProcessInfo ID="ucProcessInfo1" runat="server" />
</div>
<%-- <div style="float: right">
<uc2:ucGridActions ID="ucGridActions1" runat="server" />
</div>--%>
<br />
<div>
<table>
<thead class="gridHeader">
</thead>
</table>
<table>
<tr>
<td>
<div>
<input id="btnEdit" type="button" value="button" style="display: none; visibility: hidden;" runat="server" />
<div id="demo">
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>
</div>
<br />
</div>
</td>
</tr>
</table>
</div>
<asp:ModalPopupExtender ID="ModalPopupExtender1"
runat="server" CancelControlID="btnCancel"
OkControlID="btnOkay" TargetControlID="btnEdit"
PopupControlID="Panel1" PopupDragHandleControlID="PopupHeader"
Drag="true" BackgroundCssClass="DarkenBackground">
</asp:ModalPopupExtender>
<div class="popupConfirmation" id="Panel1" style="display: none">
<iframe id="frameeditexpanse" src="AddEdit.aspx" frameborder="0"></iframe>
<div class="popup_Buttons" style="display: none">
<input id="btnOkay" type="button" value="Done" />
<input id="btnCancel" type="button" value="Cancel" />
</div>
</div>
</asp:Content>
AddEdit.aspx
<%# Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="AddEdit.aspx.cs" Inherits="TransitionAutomationPlatform.WebApp.Templates.ContractSummaryNote.AddEdit" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<link href="../../Content/jquery.dataTables.css" rel="stylesheet" />
<link href="../../Content/TableTools.css" rel="stylesheet" />
<script src="../../Scripts/General.js"></script>
<script src="../../Scripts/JsTemplates/ContractSummaryNote.js"></script>
<script type="text/javascript" src="../../Scripts/ZeroClipboard/ZeroClipboard.js"></script>
<script src="../../Scripts/jquery.dataTables.js"></script>
<script src="../../Scripts/dataTables.tableTools.js"></script>
<script src="../../Scripts/jquery-1.11.3.min.js"> </script>
<script src="../../Scripts/jquery-ui.min.js"></script>
<script src="../../Scripts/jquery.dataTables.min.js"></script>
<%--<script src="../../Scripts/dataTables.buttons.min.js"></script>--%>
<script src="../../Scripts/jquery-ui-1.11.3/jquery-ui-1.11.3/jquery-ui.js"></script>
<script src="../../Scripts/jquery-ui-1.11.3/jquery-ui-1.11.3/jquery-ui.js"></script>
<script src="../../Scripts/jquery-ui-1.11.3/jquery-ui-1.11.3/jquery-ui.min.js"></script>
<script src="../../Scripts/buttons.flash.min.js"></script>
<script src="../../Scripts/jszip.js"></script>
<script src="../../Scripts/jszip.min.js"></script>
<script src="../../Scripts/pdfmake.min.js"></script>
<script src="../../Scripts/vfs_fonts.js"></script>
<%--<script src="../../Scripts/dataTables.buttons.min.js"></script>--%>
<script src="../../Scripts/buttons.html5.min.js"></script>
<script src="../../Scripts/dataTables.editor.js"></script>
<div class="popup_Container">
<div class="popup_Titlebar" id="PopupHeader">
<div class="TitlebarLeft">
Edit Expanse
</div>
<div class="TitlebarRight" onclick="cancel();">
</div>
</div>
<div class="popup_Body">
<div id="dialog-message" title="Contract Summary Note Details">
<table>
<tr>
<td>
<table style="border-bottom: 1px solid #dadada;" class="ModalTable">
<tr>
<td>Document Name<span style="color: red;">*</span></td>
<td>
<input type="text" id="txtDocumentName" maxlength="50" /></td>
</tr>
<tr>
<td>Clause No<span style="color: red;">*</span></td>
<td>
<input type="text" id="txtClauseNo" maxlength="50" /></td>
</tr>
<tr>
<td>Page No <span style="color: red;">*</span></td>
<td>
<input type="text" id="txtPageNo" maxlength="50" /></td>
</tr>
<tr>
<td>Linl EPM Task<span style="color: red;">*</span></td>
<td>
<select name="ddlEPMTaskName" id="ddlEPMTaskName"></select>
<%-- Group Details--%>
</td>
</tr>
<tr>
<td>Due Date as per Project Plan</td>
<td>
<input type="text" id="txtDueDate" /></td>
</tr>
<tr>
<td>Function Name <span style="color: red;">*</span></td>
<td>
<select name="ddlFunctionName" id="ddlFunctionName"></select>
<%-- Group Details--%>
</td>
</tr>
<tr>
<td>Owner</td>
<td>
<input type="text" id="txtOwner" />
<tr>
<td>Activity at risk of missing Contracted Due Date</td>
<td>
<input type="checkbox" id="chkIsActivityAtRisk" value="" checked="checked" /></td>
</tr>
<tr>
<td>Status <span style="color: red;">*</span></td>
<td>
<select name="ddlStatus" id="ddlStatus"></select>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
edit data
</div>
<div class="popup_Buttons">
<input id="btnOkay" type="button" value="Done" runat="server" />
<input id="btnCancel" type="button" value="Cancel" />
</div>
</div>
</asp:Content>
<%-- Reference for Js file --%>