('#Window').data('tWindow').close() - asp.net-mvc-3

Question

I have a telerik popped up window. It opens fine; however, I am having an issue closing the window. If I add an alert to the javascript, alert("#Window") or alert($(this).closest('#Window')), it will display [object Object]. However, alter("#Window").data("tWindow") or alert($(this).closest('#Window').data('tWindow')) will display null. I've removed the jquery and javascript reference from either the parent or the child page, and it did not make any difference. Any kind of help would be greatly appreciated. See sample code below
Here is the popup window:
#{Html.Telerik().Window()
.Name("Window")
.Title("Student Window")
.LoadContentFrom(Url.Action("AddReason", "Reason", new { id = reasonID }, Request.Url.Scheme))
.ClientEvents(events => events
.OnClose("ClosingWindow")
)
.Draggable(false)
.Scrollable(false)
.Width(800)
.Height(600)
.Modal(true)
.Visible(false)
//.Effects(fx => fx
// .Zoom()
// .Opacity())
.Render();
}
Here is the JavaScript:
<script src="#Url.Content("~/Scripts/jquery-1.4.4.js")" type="text/javascript">
</script>
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/spin.min.js")" type="text/javascript"></script>
function DoOpen(id) {
var url = '#Url.Action("AddReason","Reason")';
$.post(url, { id: id }, function (data) {
var window = $('#Window').data('tWindow').center();
window.content(data);
window.open();
});
}
//This javascript is in the main page
//I did an alert. alert($('#Window')) and
alert($('#Window').data('tWindow')) they both return null
function ClosingWindow() {
$('#Window').prop("checked", "checked");
$('#Window').data('tWindow').close();
window.location.href = window.location.href;
}
Here is the partial view :
#model Student.Models.Reason
#using Student.Example
#{
ViewBag.Title = "Add Reason";
Layout = "~/Views/Shared/_PartialReason.cshtml";
}
<script type="text/javascript">
function CloseWindow() {
// alert($("#Window").closest('.t-window').data('#tWindow'));
// $("#Window").data("tWindow").close();
$('#Window').prop("checked", "checked");
window.location.href = window.location.href;
}
</script>
#using (Html.BeginForm("AddReason", "Reason", FormMethod.Post))
{
#Html.ValidationSummary(true)
<fieldset>
<div class="editor-field">
#(Html.Telerik().Editor()
.Name("EncountersArchive")
.HtmlAttributes(new { style = "height:310px;", id = "AddAReason" })
.Encode(true)
.Tools(
tools => tools
.Clear()
.Bold().Italic().Underline().Strikethrough().Subscript().Superscript().Separator()
.FontName().FontSize()
.FontColor().BackColor().Separator()
.JustifyLeft().JustifyCenter().JustifyRight().JustifyFull().Separator()
.InsertUnorderedList().InsertOrderedList().Separator()
.Indent().Outdent().Separator()
))
</div>
<p style="text-align:center">
<input type="submit" value="Reason" id="AddReasonID" onclick="CloseWindow()"/>
</p>
</fieldset>
}

Answer 1

The OnClose event on the popup window was causing the issue. The onclose events should only be used if the user wished to do someonthing else after the window is closed. If the purpose is simply to close the window, the Telerik control is automatically handling it. In my case, I simply remove the onclose event, and it works like a charm.