I am opening popup window from aspx page and updating values in parent window from child or popup window using javascript and ClientScript.RegisterStartupScript.
I have added to labels in Default.aspx page and one button to open popup window.
I've also added a PopUp.aspx page which is having two textboxes and a button to update lable values of parent page.
The textboxes in popup window are populated with Text values of lables in parent page (Default.aspx), after making changes in textbox values i'm updating values back in parent page.
HTML source Parent page
<form id="form1" runat="server"> <div> First Name : <asp:Label ID="lblFirstName" runat="server" Text="amiT"> </asp:Label><br /> <br /> Last Name: <asp:Label ID="lblLastName" runat="server" Text="jaiN"> </asp:Label><br /> <br /> <asp:Button ID="btnPop" runat="server" Text="Click To Edit Values" /> </div> </form>
Write following JavaScript in Head section of page.
1: <script type="text/javascript">
2: function openPopUp()
3: {
4: var popUrl = 'PopUp.aspx?fn=' + document.getElementById('<%= lblFirstName.ClientID %>').innerHTML + '&ln=' + document.getElementById('<%= lblLastName.ClientID %>').innerHTML;
5: var name = 'popUp';
6: var appearence ='dependent=yes,menubar=no,resizable=no,'+
7: 'status=no,toolbar=no,titlebar=no,' +
8: 'left=5,top=280,width=230px,height=140px';
9: var openWindow = window.open(popUrl, name, appearence);
10: openWindow.focus();
11: }
12: </script>
In this i m getting values of lables and passing them to popuup page as querystrings
Write this code in Page_Load event of Default.aspx (parent) page
C# CODE
protected void Page_Load(object sender, EventArgs e)
{
string updateValuesScript =
@"function updateValues(popupValues)
{
document.getElementById('lblFirstName').innerHTML=popupValues[0];
document.getElementById('lblLastName').innerHTML=popupValues[1];
}";
this.ClientScript.RegisterStartupScript(Page.GetType(),
"UpdateValues", updateValuesScript.ToString(), true);
btnPop.Attributes.Add("onclick", "openPopUp('PopUp.aspx')");
}
VB.NET
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
Dim updateValuesScript As String = "function updateValues(popupValues)" & vbCr & vbLf & "{" & vbCr & vbLf & " document.getElementById('lblFirstName').innerHTML=popupValues[0];" & vbCr & vbLf & " document.getElementById('lblLastName').innerHTML=popupValues[1];" & vbCr & vbLf & "}"
Me.ClientScript.RegisterStartupScript(Page.[GetType](), "UpdateValues", updateValuesScript.ToString(), True)
btnPop.Attributes.Add("onclick", "openPopUp('PopUp.aspx')")
End Sub
HTML SOURCE OF PopUp.aspx(child) page
<form id="form1" runat="server"> <div> First Name : <asp:TextBox ID="txtPopFName" runat="server" Width="113px"> </asp:TextBox><br /> <br /> Last Name:<asp:TextBox ID="txtPopLName" runat="server" Width="109px"> </asp:TextBox><br /> <br /> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" /></div> </form>
C# CODE PopUp.aspx
protected void Page_Load(object sender, EventArgs e)
{
string updateParentScript =
@"function updateParentWindow()
{
var fName=document.getElementById('txtPopFName').value;
var lName=document.getElementById('txtPopLName').value;
var arrayValues= new Array(fName,lName);
window.opener.updateValues(arrayValues);
window.close();
}";
this.ClientScript.RegisterStartupScript(this.GetType(),
"UpdateParentWindow", updateParentScript, true);
if (!IsPostBack)
{
txtPopFName.Text = Request["fn"];
txtPopLName.Text = Request["ln"];
}
Button1.Attributes.Add("onclick", "updateParentWindow()");
}
VB.NET
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
Dim updateParentScript As String = "function updateParentWindow()" & vbCr & vbLf & " { " & vbCr & vbLf & " var fName=document.getElementById('txtPopFName').value; " & vbCr & vbLf & " var lName=document.getElementById('txtPopLName').value; " & vbCr & vbLf & " var arrayValues= new Array(fName,lName);" & vbCr & vbLf & " window.opener.updateValues(arrayValues); " & vbCr & vbLf & " window.close(); " & vbCr & vbLf & " }"
Me.ClientScript.RegisterStartupScript(Me.[GetType](), "UpdateParentWindow", updateParentScript, True)
If Not IsPostBack Then
txtPopFName.Text = Request("fn")
txtPopLName.Text = Request("ln")
End If
Button1.Attributes.Add("onclick", "updateParentWindow()")
End Sub
Hope this helps
Download sample code attached

Hi, I have one problem related to your post which is why every time when we click on that button then the value will change back to default value? Can it possible after click on the button and the value won't be changing back to the default value?
ReplyDeleteDude this is sick! This is exactly what I was looking for. Thank you.
ReplyDeletePlease, What can i do for this not to return to the default value after clicking the button again.
ReplyDeleteThanks For Ur Help For Passing Data Using popup control.As Yhis Code Is Workimg In normal Pages.But
ReplyDeletethis code is not working when we use this page in content pages error (document.element id can not be null) Project Which Having Master Pages And Content Pages As U have Use This Code In Default Page2(parent Form) ( It is Inheritted Page Of master Page) popup control page (default3) (this is also inherited page of master page) It is Showing Error Ie Document Cant Be null
please resolve it as iam using this code in my project
this code is not working when we use this page in content pages error (document.element id can not be null) Project Which Having Master Pages And Content Pages As U have Use This Code In Default Page2(parent Form) ( It is Inheritted Page Of master Page) popup control page (default3) (this is also inherited page of master page) It is Showing Error Ie Document Cant Be null
ReplyDeletehello sir Regarding Ur Post It Is Very Nice I Have Used This Sample In My Project. This Sample Works Fine When It Doen'tWork When We Use This Sample having content Pages Pls Help Me its Showing document.null error(javascript Error)
ReplyDeleteThanks for the tutorial, this is very usefull.
ReplyDeleteThis article is great
ReplyDeletehello amit...how will u assign the checkboxlist selected value back to the main page. Lets say In the pop up page there is a asp:checkboxlist control and after selecting some checkboxes, and click on submit (or some button), the selected values should list back in the main page from where this pop was called. In the main page, there is a list box to which values should be assigned..Please reply me ASAP
ReplyDeletehello amit...how will u assign the checkboxlist selected value back to the main page. Lets say In the pop up page there is a asp:checkboxlist control and after selecting some checkboxes, and click on submit (or some button), the selected values should list back in the main page from where this pop was called. In the main page, there is a list box to which values should be assigned..Please reply me ASAP
ReplyDeleteHi, This Article Helps me much.
ReplyDeleteThank You
thanks for the info and explanation provided
ReplyDeleteLove your example, almost exactly what I needed. To make the pop up update a text box I used...
ReplyDeletedocument.getElementById('txtSearchValue').Value=popupValues[0];
in place of the .InnerHTML in the updateValues javascript function.
Thanks !!
Great tutorial!
ReplyDeleteHave you considered adding some live class diagrams to your code? Please check my address and think about.
Thanks for the code and such an informative post. It was really helpful. Good stuff
ReplyDeleteThank You Kind Sir!
ReplyDeleteNice coding this..
ReplyDeletepopup window well.
NIce coding this...
ReplyDeleteBeautiful Blog and excellent posts keep up the good work i have implemented in my requirement seeing this
ReplyDeleteNo offense, but i suggest adding a facebook like button for the blog!
ReplyDeletesir
ReplyDeletei have some problem in user control, like i have 1 Usercontrol Having Text Box(as will as textChange event) and 1 aspx Page whre we use this usercontrol.in this page 1 Gridview .i wana to filter this gridview when any value entered on Usercontrol textbox, bind this gridview on TextChange Event of usercontrol.plz help me.
thanks in advance
@Sandeep Sharma: Download the sample code i have created from the link below and let me know whether it solves your query or not ?
ReplyDeleteFilter GridView On TextBox TextChanged Event
.
how can I do this via click button of grid view , for example if pop window have a button in a grid
ReplyDeleteThanks friend this is more help me
ReplyDeleteIn above same code i have an error Unable to get value of the property 'focus': object is null or undefined
ReplyDeletePlease tell me solution.
This code will not work because of the following undefined variables:
ReplyDeletetxtPopFName.Text = Request["fn"];
txtPopLName.Text = Request["ln"];
No where on either page is fn or ln defined