Close iframe fancybox when child page submitted and reload parent page - c#

I have iframe fancybox on my page. On the child page, I add something to DB when Add Button clicked. After this process I want to close the fancybox and reload the parent page. How can I do it?

this should be called on page reload..
window.parent.closeDialogFormSubmit();
//Or
window.top.parent.closeDialogFormSubmit();
this closeDialogFormSubmit function should be on fancy box open on that page.
closeDialogFormSubmit write code for fancy box close code.
the function should be written outside $(document).ready(function(){}); or $(function(){}); else it will not find the function and gives error undefined.

1). In the child page
Use the API method parent.$.fancybox.close()
You could create a button like :
<img src="myCloseButton.png" alt="close fancybox" />
Bear in mind that interaction between those pages is subject to the same origin policy so if the child page is in another domain parent.$.fancybox.close() may not work.
EDIT : if the child page should be closed after a form is submitted, then set the closing method using the onsubmit attribute in the form tag like :
<form id="login_form" action="process.php" onsubmit="javascript:parent.jQuery.fancybox.close();">
See this post for further reference and demo.
2). In the parent page
Add to your custom script the afterClose callback like :
$(".fancybox").fancybox({
afterClose : function() {
location.reload();
return;
}
});
... to reload the page after closing fancybox. See JSFIDDLE

Related

Change Image Src from child pop doesn't affect code behind

I have Parent Web Form where I have image.
I have although link in form when I click I open new pop up contains another Page like that :
function openPopUp() {
popup = window.open("/CropImage.aspx", "Popup", "width=700,height=700");
popup.focus();
}
in the child pop up page I choose image and pass it again to parent Page by setting parent page image src.
opener.document.getElementById("tile_Image").src = "/Path/imageName.jpg" ;
the parent page image changed already but when I access it from code behind I find no src for image.
how can I solve this problem?
The value isn't visible on the server because nothing is sending it to the server.
JavaScript executes on the client, after the server-side code has already completed executing and delivered the resulting page to the client. Therefore you can't expect to access this value from code-behind while rendering the page. Then in a post-back, only changes that get posted to the server from form elements are available to the server. Therefore you can't expect to access this value from code-behind after the page is posted.
Data posted to the server is in form fields. The entire HTML of the page isn't posted to the server.
If you want to include it in a form field, put something like a hidden field somewhere on your page:
<asp:Hidden runat="server" ID="imageValue" />
Then in your JavaScript you can also set the value of that form field:
opener.document.getElementById("tile_Image").src = "/Path/imageName.jpg";
opener.document.getElementById("<%=imageValue.ClientID%>").value = "/Path/imageName.jpg";

Call PageLoad of parent page after closing modal popup

I have a parent page to display the project details, and user enter part details by uploading a template in a modal pop-up.
To open the modal popup I'm calling this function
function importfile()
{
var url="SCN_UploadPart.aspx";
var selSCE=window.showModalDialog(url,'win','help:no;status:no;scroll:no;resize:no;dialogHeight:300px;dialogWidth:490px');
return false;
}
Earlier I was using OnClinetClick method of Uplaod Button to call this method, then the project page or parent page was automatically reloading. But now I'm calling it like this.
ClientScript.RegisterStartupScript(this.GetType(), "project", "<script language='javascript'>importfile();</script>");
onclick of same Upload Button.
I font why the page does not reload now. I want the page to be reloaded as I am showing the content in the parent page after uploading the parts.
Please suggest me the way to reload the Parent page on click of close in modalpopup.
U can refer below link its show the demo
http://codedisplay.com/automaticaly-refresh-parent-window-whenever-popup-window-is-closed/
http://www.mindfiresolutions.com/Refresh-parent-page-on-closing-modal-child-windowpopup-29.php
Hope it helps u

How do I send data to another screen after selection

I have a page where If you click a link, e.g. 'search' it will open a search page and you can then select an item from the gridview to use in the previous (parent) page.
I was wondering how I would go about sending back the information to the parent page and then refresh the parent page to fill in the other data?
I am guessing it will be some kind of javascript dynamically created in the code behind?
window.opener is the window that opened the current window.
So, if you popup a temporary window from some page, you can use window.opener from the popup window to reference the previous page objects or global variables in that page to put data back into the parent window.
Most web apps these days avoid popups because of the various popup restrictions in browsers. Instead, folks tend to use overlays in the same window which don't run afoul of popup blockers.
For example, from the popup window, you could do something like this:
window.opener.document.getElementById("result") = myHTML;
or:
window.opener.searchData.choice = "foo";
or:
window.opener.myFunc(data);
Use popup div showed when u change the value of the input , the necessary 2 steps : sending ajax data and receiving the data in the same page
The best way that I see is calling parent function from opener
I don't know which html has your popup page but maybe something like this:
//child
...
<table>
<tr>
<td>item 100</td> <td><input type="button" id="searchResult100" onclick="updateParent(100)"></td>
</tr>
</table>
...
function updateParent(id){
if(window.opener){
window.opener.updateData(id);
window.close();
}
}
I don't know how you want to use ID that is selected on the popup, you can hide all results that have different ID or put id inside some hiddenfield and do a postback to use the ID on the code behind. Need more information about the purpose.
//parent
...
function updateData(searchId){
// use searchId to update
}

How to pass values from an asp.net child page to the parent page

I have two web pages, Page1 and Page2, which can both open the same child popup page.
If the parent page is Page1 I want certain input from the Child page to returned to the parent page and if the parent page is Page2 I want other information to be returned.
I do identify who is the parent page and how do I return the input to it and have it show in the proper text box or DroDownList?
I tried using Request.UrlReferrer putting results in a string variable and I got an error 'object not set to an instance'.
As both the pages can be parent , write the a javascript function that works as receiver on both the page and write code in it as per your requirement.
e.g.
javascript on Parent page:
SetDataFromPopup(data)
{
document.getElementById('TextBox1ClientId').value = data;
}
On popup write the following line
window.opener.SetDataFromPopup(data);
this should be called on the event where you want to pass the data e.g. suppose you have a button on client click of it you want to pass the data , the code should look like:
<input id="btnSave" type="submit" onclick="window.opener.SetDataFromPopup(data);" >Save</input>

Calling a parent page code behind method from a child page code behind - ASP.NET 2.0 Page Inheritance model

What would be the best way to call a method in the code-behind of parent page from the code behind of the child page in the ASP.NET 2.0 Web Site model?
Scenario: User clicks a link in the parent page to view a data record's detail in child page (The parent and child are tow seperate pages). The user will modified the data in the client page. Once the child page has processed the update, the child page will close and I need to rebind the parent page to reflect the update.
I did something similar, but it was calling the parent page from a user control that was included in the parent page
if(Page.GetType().ToString().Contains("ASP.Default_aspx"))
{
MethodInfo MyMethod = this.Parent.TemplateControl.GetType().GetMethod("MyMethod");
MyMethod.Invoke(this.Page, null);
MyMethod = null;
}
UPDATE: I have to do this from the code behind because the child page closes after the data has been updated.
Easiest way would be to do the whole thing on one page using a multiview or some such thing.
Other then that, with javascript you can call
document.opener.location.href = "url";
to change the url on the parent page. You could just keep it the same, or stick stuff in the query string and muck with those values on Page_Load
If you're opening the child page in a modal pop-up, you can access window.returnValue on the parent page (via JavaScript) and then invoke a page refresh or an Ajaxy rebind call.
Check this page out for how to return value from modal pop-up and do something based on that value on parent page.
However, if you have the option, I'd get away from opening the edit form in a separate page. I'd put the edit form in a user control and show/hide it a la lightbox style.
Not sure if this is exactly what you want but you could have used cross page posting for this. This allows you to post back to the parent page from the child page with the advantage of having access to the child page's ViewState. To do this you set the PostBackUrl property of a button to the child page. In the parent page you can then access the PreviousPage property to retrieve values from the child page. So in the child page have a button such as:
<asp:Button ID="Button1" runat="server" Text="Update data"
PostBackUrl="~/Parent.aspx" onclick="Button1_Click" />
Then in the Parent.aspx Page_Load event:
protected void Page_Load(object sender, EventArgs e) {
if (IsCrossPagePostBack) {
Page prevPage = this.PreviousPage;
string myVal = prevPage.FindControl("myTextBox1").ToString();
string myVal2 = prevPage.FindControl("myTextBox2").ToString();
//etc
}
}

Categories