Java Script Tutors with Asp.net
While Using showModalDialog (window.showModalDialog) of JavaScript
you can close Current Child Window and Refresh Parent Page Using Following:
set location of current window to opener and refresh current window.
This will give Location (URL) of parent window who opened child window.
window.opener.location
function ClickbtnBindGridView()
{
window.opener.location.href = window.opener.location;
window.close();
}
{
window.opener.location.href = window.opener.location;
window.close();
}
and we can call using Script Manager in asp.net Code Behind :
ScriptManager.RegisterClientScriptBlock(this, this.GetType(), Guid.NewGuid().ToString(), "ClickbtnBindGridView();", true);
Above Functions Works well For Firefox and Chrome
for Internet Explorer we can use :
On Parent Form :
JavaScript:
<script type="text/javascript">
function OpenChildWindow() {
//open a new dialog window
var sFeatures = "dialogHeight: 200px;";
sFeatures += "dialogWidth: 400px;";
sFeatures += "center: yes;";
sFeatures += "edge: sunken;";
sFeatures += "scroll: no;";
sFeatures += "status: yes;";
sFeatures += "resizeable: no;";
var url = 'ChildForm.aspx?SomeValue=12345';
entryWindow = window.showModalDialog(url, 'ChildForm', sFeatures);
if (entryWindow == true) {
alert("Watch for CurrTime & ChildWin labels," +
" its going to update as new window saved.");
//this would trigger the update panels
//update as the button is part of the UP
window.document.getElementById('btnHiddenForUpdate').click();
}
else {
//No change will happen to the parent page as child page did nothing
alert("Nothing on the page will change " +
"as the new child window was cancelled.");
}
}
</script>
HTML :
<form id="form1" runat="server">
<asp:ScriptManager ID="smParent" runat="server" />
<div id="divUpdatePanel">
<asp:UpdatePanel ID="upParent" runat="server">
<ContentTemplate>
<asp:Label ID="lblCurrTime" runat="server" Text="CurrTime:">
</asp:Label> <br />
<asp:Label ID="lblChildWinValue" runat="server"
Text="ChildWin Value:"></asp:Label><br />
<br /><a href="javascript:OpenChildWindow();">
Click to open the Child Window</a><br />
<input type="button" id="btnHiddenForUpdate"
runat="server" style="display:none"
onserverclick="btnHiddenForUpdate_ServerClick" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div id="divNormalUpdatePanel">
<asp:Panel ID="pnlFullPostback" runat="server">
<asp:Label ID="lblPageLoadTime" runat="server"
Text="PageLoadTime:"></asp:Label>
</asp:Panel>
</div>
</form>
Child Form can be 2 ways
Method 1
JavaScript:
<script type="text/javascript">
function WindowClose() {
window.returnValue = true;
window.close();
}
function WindowCancel() {
window.returnValue = false;
window.close();
}
</script>
HTML:
<form id="form1" runat="server">
<div>
<input id="Button2" type="button" value="Update" runat="server" onclick="WindowClose();" title="CLose Button" />
<input type="button" value="Close" onclick="WindowCancel();" title="CLose Button" />
</div>
</form>
Method 2
JavaScript
<script type="text/javascript">
function UpdateClick() {
window.returnValue = true;
window.close();
}
</script>
HTML
<asp:Button ID="btnUpdate" Text="Update" runat="server" CssClass="Button" OnClick="btnUpdate_Click" />
<asp:Button ID="btnCancel" Text="Cancel" runat="server" CssClass="Button" OnClientClick="javascript:window.close();" />
Above Functions Works well For Firefox and Chrome
for Internet Explorer we can use :
On Parent Form :
JavaScript:
<script type="text/javascript">
function OpenChildWindow() {
//open a new dialog window
var sFeatures = "dialogHeight: 200px;";
sFeatures += "dialogWidth: 400px;";
sFeatures += "center: yes;";
sFeatures += "edge: sunken;";
sFeatures += "scroll: no;";
sFeatures += "status: yes;";
sFeatures += "resizeable: no;";
var url = 'ChildForm.aspx?SomeValue=12345';
entryWindow = window.showModalDialog(url, 'ChildForm', sFeatures);
if (entryWindow == true) {
alert("Watch for CurrTime & ChildWin labels," +
" its going to update as new window saved.");
//this would trigger the update panels
//update as the button is part of the UP
window.document.getElementById('btnHiddenForUpdate').click();
}
else {
//No change will happen to the parent page as child page did nothing
alert("Nothing on the page will change " +
"as the new child window was cancelled.");
}
}
</script>
HTML :
<form id="form1" runat="server">
<asp:ScriptManager ID="smParent" runat="server" />
<div id="divUpdatePanel">
<asp:UpdatePanel ID="upParent" runat="server">
<ContentTemplate>
<asp:Label ID="lblCurrTime" runat="server" Text="CurrTime:">
</asp:Label> <br />
<asp:Label ID="lblChildWinValue" runat="server"
Text="ChildWin Value:"></asp:Label><br />
<br /><a href="javascript:OpenChildWindow();">
Click to open the Child Window</a><br />
<input type="button" id="btnHiddenForUpdate"
runat="server" style="display:none"
onserverclick="btnHiddenForUpdate_ServerClick" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div id="divNormalUpdatePanel">
<asp:Panel ID="pnlFullPostback" runat="server">
<asp:Label ID="lblPageLoadTime" runat="server"
Text="PageLoadTime:"></asp:Label>
</asp:Panel>
</div>
</form>
Child Form can be 2 ways
Method 1
JavaScript:
<script type="text/javascript">
function WindowClose() {
window.returnValue = true;
window.close();
}
function WindowCancel() {
window.returnValue = false;
window.close();
}
</script>
HTML:
<form id="form1" runat="server">
<div>
<input id="Button2" type="button" value="Update" runat="server" onclick="WindowClose();" title="CLose Button" />
<input type="button" value="Close" onclick="WindowCancel();" title="CLose Button" />
</div>
</form>
Method 2
JavaScript
<script type="text/javascript">
function UpdateClick() {
window.returnValue = true;
window.close();
}
</script>
HTML
<asp:Button ID="btnUpdate" Text="Update" runat="server" CssClass="Button" OnClick="btnUpdate_Click" />
<asp:Button ID="btnCancel" Text="Cancel" runat="server" CssClass="Button" OnClientClick="javascript:window.close();" />