Most of the Web application
required a search screen for filtering the data separately. Searching may some
numbers, Address or may be name, Sometimes it may be a one row of record. The
below example showing an example for search window with return value to the
parent. Here a normal asp.net page with one text box and one search button
.Once user click search button a popup window will display on top of asp.net
page. User can enter a value on the textbox and click ok then text value will
be display in textbox of parent window.
Parent Window Code
Major part of this code is calling
the popup window .Using the Window. Open method it will display popup in center
of the screen.
<head runat="server">
<script
type="text/javascript">
function
ShowModelPopup() {
popUpObj = window.open("SearchPopUP.aspx","Search by Name","toolbar=no,
scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=300,
height=300,left =
390,top=200" );
popUpObj.focus();
}
</script>
<title></title>
</head>
<body>
<form
id="form1"
runat="server">
<div
id='divBackground'></div>
<asp:TextBox ID="txtSearch"
runat=server > </asp:TextBox>
<asp:Button ID="btnSearch"
runat="server"
OnClientClick="ShowModelPopup()"
Text="Search"/>
</form>
</body>
</html>
Child window for showing the details.
Here the major part is closing
event of popup form. When user click ok/Close javascript unload event will fire
and from there we will access the parent window controls using Window.opener property which is
provided by JavaScript.
<head runat="server">
<title></title>
<script
type="text/javascript">
window.onbeforeunload = RefreshParent;
function
RefreshParent() {
if
(window.opener != null &&
!window.opener.closed) {
window.opener.document.getElementById('txtSearch').value
= document.getElementById('txtName').value;
}
}
function closeWindow() {
close();
}
</script>
</head>
<body>
<form
id="form1"
runat="server">
<div>
<asp:TextBox ID="txtName"
runat="server"
></asp:TextBox>
<asp:Button ID="btnSearch"
runat="server"
Text="OK"
OnClientClick="closeWindow()"
/>
</div>
</form>
</body>
</html>
Instead of using textbox we can use some
hidden text in popup control , This will be useful for if more data need to
pass to the parent. We can also pass XML format data for maintain generalized
format.
No comments:
Post a Comment