Javascript refresh main page after closing child window (popup) - javascript

I have 3 php files: view.php, edit.php and edit2.php.
I use view.php to display content of my DB tables, edit.php to edit a specific row (I use textboxes etc.) and edit2.php to write any changes to my database. After the query is successfully executed, edit2.php uses header("Location: edit.php"); to display the chosen row again (I use session variables in edit.php and unset them on view.php).
edit.php and edit2.php are opened in a small popup window. Now what I would like to have is when I close my small window, view.php should be refreshed.
I tried using onunload but what it does it is triggers itself each time a button is clicked in edit.php to send data to edit2.php, so when it returns to edit.php, it's blank because session variables are unset due to refreshing of view.php.
I have this strange feeling, that I might have explained it in a twisted way... Nevertheless, I would need some help.

What you want to do is open a new window using window.open('edit.php')
Here is the documentation for window.open()
Then watch for when the new window is closed, and refresh the page when that happens. Unfortunately there is no 'on close' event that's fired, but there is a property window.closed that you can watch to see when the window is closed.
So this is what you should do:
var win = window.open('edit.php','Edit Row','width=800,height=600,status=0,toolbar=0');
var timer = setInterval(function() {
if(win.closed) {
clearInterval(timer);
location.reload()
}
}, 1000);

Related

Refresh one php page from another page

I have one PHP page(dashboard.php). on click on a button it opens up one pop up page(viewstatus.php).I updates some data on this page and click submit button on this page it updtes the data and close this popup and refresh the page dashboard.php.But my page dashboard.php is not refreshing. This is the code written on the file viewstatus.php.
$query->execute();
$_SESSION['msg']="Stationery Added successfully";
header("Refresh:0; url=dashboard.php");
echo "<script>window.close();</script>";
Try this please:
$query->execute();
$_SESSION['msg']="Stationery Added successfully";
header("Refresh:0; url=dashboard.php");
echo "<script>window.opener.location.reload();window.close();</script>";
The reason the page is not refreshing is because the header is redirecting the popup page, not the dashboard page.
Refreshing the page on demand is going to be pretty difficult.
When you open the popup you can save that variable in javascript and add an onclose listener, but this is not supported in all browsers.
var popup = window.open('...');
if (popup) {
popup.onclose = function(){ window.location.reload };
}
Another way would be in your popup window to add the following code:
window.opener.location.reload();
Just add that above the window.close(); that you put in your example code and it might work.
It worked for me, but just as the other one I don't know if this is supported by all browsers.

Refresh Page with URL Hash after Submitting Form with jQuery Tabs

I'm a long time self taught user, just never had an issue that wasn't already answered in some form or another. Awesome community thank you all!
So I am dumbfounded as to why javascript will not properly refresh my page.
I have a very large page that I use with jquery and vertical tabs tagged with url hashes. This is a new function I recently added after updating to the newest version.
Upon clicking submit the form refreshes and if $_POST[update] is set it will run a set of queries. Then I have a javascript timeout that refreshes the page (ideally to the correct tab ex: home/database.php?file=101#tab3)
an excerpt of my messy code:
if(isset($_POST['update']))
{ do a bunch of sql stuff
....
<pre>
<?PHP
//unset update variable
$_POST = array();
//print_r(get_defined_vars());
?>
</pre>
</br>
<script type="text/javascript">
function Redirect() {
$('#redirect').trigger('click');
}
var currenturl = window.location.href;
document.write("<form action=" + currenturl +"><input type=submit name=redirect value=Redirect></form>");
document.write("</br>You will be redirected back to the file in 2 seconds.");
setTimeout('Redirect()', 2000);
</script>
<?php
mysql_close($conn);
}
else
{ display usual data....check boxes etc
Now I've tried refreshing in every conceivable way. I clear out the $_POST array so the page should reload displaying information, but it doesn't. However my confirmation of queries being ran show that 0 rows updated, so its not triggering the sql but also isn't properly refreshing still.
I found a function that stored the last clicked tab in the browsers session, however when you switch files, it would skip to that tab. Instead I would want to show the default tab.
I even tried made a button that on click it goes to the proper url which is shown above. It works when I click it manually but does not work when I trigger it via javascript. Even goes to the appropriate tab.
I am updating the url in the address bar using the below function. Also using the latest version of chrome.
<script>
$( "#tabs" ).tabs({
activate: function(event, ui) {
window.location.replace('#' + $(ui.newPanel).attr('id'));
var curTab = $(ui.newPanel).attr('id');
console.log(curTab);
}
});
</script>
Why don't you instead of sending that number after <form_url>?<params>#3 send that number as a request param in the url, for example like this <form_url>?tab=3?

php or javascript session rules popup

I just created a Pup-up using Magnific Pop-up. I now have to set the session rules:
The popup has to appear 5 seconds after the user lands in the website and has not to be shown for the rest of session
The popup has to appear 5 times for each user's session: as soon as the user does not perform any action on the popup or the user closes the popup 5 times, the popup doesn't have to appear anymore.
Can you help me please? Thanks in advance!
Below is a simple solution, however depending on how your site is set up other page loads and/or ajax calls could increment the counter, so be conscious of when/where you increment the session variable $_SESSION['show_popup_count']
<?php
session_start();
if(isset($_SESSION['show_popup_count'])){
//handle completely new session here
$_SESSION['show_popup_count']=0;
}
$_SESSION['show_popup_count'] += 1;
//expose value to javascript
?><script type="text/javascript">
var popupCounts = <?php echo $_SESSION['show_popup_count']; ?>;
</script><?php
.... //continue on with rest of code
then here is your additional javascript
if(popupCounts<6){
//code to show popup here
}

Is there a way to find the window of the previous page (other tab)?

If you open a link in a new tab (with MMB or right click or preferred method, however), is there a way from the new tab window to find the opener window? These don't work:
window.opener
window.parent
Maybe it's just not possible, since following a link usually 'overwrites' the window, so no ref is possible, but since we have tabs... maybe... a ref IS possible?
I want the opened window to do a postMessage to the original window to let it know the page has loaded, so the original window can update the link style.
I don't make these pages, so I don't have access to the back-end or HTML printage. Think Greasemonkey: I add JS to existing websites to improve them.
The only thing I can think of is intercepting the click event, grabbing the URL, and passing it to window.open and subsequent postMessage calls on the returned window object. Do you generate the page with these links?
In some browsers window.open(url,'_blank') will open in a tab.
I think there is two solutions to your problem
First solution : Cookies
An easy way is to set a cookie with the value of the current page everytime a link is clicked, you can use a library like this one to set a cookie and get it in the next page once you click like this
$("a").click( function () {
$.setCookie("currentPage",document.URL);
});
In the next page you just get the cookie like this
if($.getCookie("currentPage") != undefined )
var previousPage = $.getCookie("currentPage");
Second solution : Server-side langage
If you're using a server side langage like php, it's easy to get the url of the previous page :
<?php
if (isset($_SERVER['HTTP_REFERER']))
echo "<script> var previousPage='" . $_SERVER['HTTP_REFERER'] . "'; </script>";
?>
And finally, to post a message you just need to test if the previousPage variable is set:
if(previousPage != undefined)
{
// Code to post your message
}

How to get data from JS popup window when window is closing

I'm trying to capture when a form field from a popup window exists when the window is closed. I currently do not have control over the child window, but it is on the same domain as the parent window.
I've looked into using the timer functionality:
var child = window.open(...);
var timer = setInterval(checkChild, 500);
function checkChild() {
if (child.closed) {
<DO SOMETHING HERE>
clearInterval(timer);
}
}
but that won't work for me because I don't think that'll give me access to the child's data.
My popup window has a few form fields for uploading a user's profile image. My question is how would I access whether the user SUBMITTED the form or just simply closed the window? There is javascript in the popup window for the submit button that will handle actually uploading the image, but I would need to somehow capture when they click the "upload" button and be able to see that the user actually had an image to upload submitted.
Thanks in advance!
EDIT:
I went ahead and just looked into the closed window event. I couldn't actually get any data from there, but I was able to read further from the DB on the server-side code to get the data I needed.
You can use the child.onbeforeunload event to get information from the child window before it closes.
As suggested by https://stackoverflow.com/a/15769556/1600851

Categories

Resources