I have a problem. I have a page that when you click a button, a popup with a form is shown. So, I complete some data and I submit. What I want to do is, to submit the form, close the form and refresh the parent page. I don't want to do it with AJAX.
The problem is that in my parent page I have to refresh content with the input information of the form.
So when I refresh, sometimes the data is shown and sometimes not. Do you know why this could happen?
I just use onsubmit="refreshParent()" in my form. The info is stored always in my database, so I think the problem may be that sometimes the refresh catches the new info and sometimes not.
function refreshParent() {
window.opener.location.reload();
window.close();
}
I use this to reload the page that opened a popup window:
<script language="JavaScript">
<!--
function reloadParentPage() {
window.opener.location.href = window.opener.location.href;
if (window.opener.progressWindow) {
window.opener.progressWindow.close()
}
window.close();
}
//-->
</script>
By the way, the code above is called by a link or button in the popup page.
You have a race condition between the script doing the insert and the script reloading the parent.
The solution is to call refreshParent on the page after the submit - that way you know the data is in the database. You don't even have to do it on document ready - return a stub page that just defines and calls refreshParent in the head tag.
In PHP when you run post script, at the end, include this code :
echo '<html><script language="javascript">
parent.location.href="http://'.$_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"].'"; // or any other url
</script></html>';
This will output a javascript that will reload the windows.
Related
I have a problem. It is my full honor if anyone helps.
First, let me explain the workflow I want. My CMS is Wordpress. I have a webpage (views.php). In this page, I want to show a download button (id=” download-button”) just to users who has the role subscriber. In default, no one has the role subscriber. So, the button is hidden in default. When a user buys a specific product he gains the role subscriber. Now, suppose a user has opened views.php page as a tab in his browser. In this step, the button is hidden. After that, he opens another tab and buys that specific product and he gains the role subscriber. Now, if he refresh the view.php page, the download button is seen. But, I want the user to see the download button without refreshing the page. In this regard, I wrote button.php file to be called in ajax. However, it does not work.
My codes:
html code (written in view.php which is the place of download button):
<div id="div1"></div>
my javascript code (which is put inside view.php file):
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load("button.php");
});
});
</script>
my button.php code:
<?php
if (check_user_role(array('subscriber'))) {
echo ('<button id="download-button">Download</button>');
}
?>
I should note that I have written check_user_role php function in views.php.
It would be my honor if you help.
Thanks in advance.
Milad
As stated by smartdroid in one of the answers above, you can subscribe an event listener function to the window.onfocus event. Try following:
document.addEventListener("DOMContentLoaded", function (event) {
window.onfocus = function () {
$("#div1").load("button.php");
}
});
I highly recomment you to read further into javascript events.
For plain javascript:
https://www.w3schools.com/js/js_events.asp
For jQuery:
https://api.jquery.com/category/events/
Hey you have to use Window setInterval() Method, what this method does it will fire in background at your time interval set.
You can call your ajax code to set/show your button
setInterval(function(){
$("#div1").load("button.php");
}, 3000);
Make sure once you do add this button put return false so it wont execute again and again not to increase load on webpage.
$(document).ready event runs only once after the DOM is loaded. So this event will not fire unless page is reloaded.
If the user is buying a subscription in another browser tab and then returns to the original tab, windows.onfocus event will fire.
So you can use window.onfocus event to check for subscription every time view.php tab becomes active, and then show the button when necessary. So you can use something like the following, in your view.php
$(document).ready(function(){
window.onfocus = function () {
$("#div1").load("button.php");
}
});
Add an iframe to your view.php that doesn't need to contain anyting nor be visible.
<iframe name="download" id="if_download" src="blank.html"></iframe>
Target the download-action to the iframe. With some JS:
function download(href) {
window.frames['download'].location = 'download.php?file=' + href;
return false;
}
You may need to wrap the download-action through a php-file to modify its header
download.php:
$file_name = $_GET['file'];
//validate file exists and *remove any ../ - simple:
if (strpos($file_name, '/') !== false) die('yeah right..');
header("Content-Disposition: attachment;filename=\"$file_name\"");
echo file_get_contents($file_name);
die();
I have 3 php files: view.php, edit.php and edit2.php.
view.php is where I view the content of my database. I use edit.php to enter new data and it's a small window that in which I type in a content I want to include in my db.
Then, I pass all of the data to edit2.php which doesn't display anything but only has implemented MySQL queries.
Now I would like to have something like this:
I'm on view.php. I click a button, edit.php opens as a new, small window. I enter the data, click SUBMIT button, everything is sent to edit2.php but at the same time the window is closed and view.php is refreshed.
I would be thankful if you could help. Thanks in advance.
You can use the js function window.opener.location.reload().There is no need of ajax for refreshing the page..Simple js is enough.
You may use
header('Location: view.php');
at the end of your edit2.php
Add following code to your edit.php
<script>
window.onunload = refreshParent;
function refreshParent() {
window.opener.location.reload();
}
</script>
I have to do some kind of operation on the page refresh or reload. that is when I hit next page or Filter or refresh on the grid. I need to show some confirmation box over this Events.
is there any event which can tell you page is doing filer? refresh or paging? using javascript?
Thanks
If it is refreshing (or the user is leaving the website/closing the browser), window.onunload will fire.
// From MDN
window.onunload = unloadPage;
function unloadPage()
{
alert("unload event detected!");
}
https://developer.mozilla.org/en/DOM/window.onunload
If you just want a confirmation box to allow them to stay, use this:
window.onbeforeunload = function() {
return "Are you sure you want to navigate away?";
}
You can create a hidden field and set its value on first page load. When the page is loaded again, you can check the hidden field. If it's empty then the page is loaded for the first time, else it's refreshed. Some thing like this:
HTML
<body onLoad="CheckPageLoad();">
<input type="hidden" name="visit" id="visit" value="" />
</body>
JS
function CheckPageLoad() {
if (document.getElementById("visit").value == "") {
// This is a fresh page load
document.getElementById("visit").value = "1";
}
else {
// This is a page refresh
}
}
There are some clarification notes on wrestling with this I think are critical.
First, the refresh/hidden field system works on the beginning of the new page copy and after, not on leaving the first page copy.
From my research of this method and a few others, there is no way, primarily due to privacy standards, to detect a refresh of a page during unload or earlier. only after the load of the new page and later.
I had a similar issue request, but basically it was terminate session on exit of page, and while looking through that, found that a browser treats a reload/refresh as two distinct pieces:
close the current window (fires onbeforeunload and onunload js events).
request the page as if you never had it. Session on server of course has no issue, but no querystring changes/added values to the page's last used url.
These happen in just that order as well. Only a custom or non standard browser will behave differently.
$(function () {
if (performance.navigation.type == 1) {
yourFunction();
}
});
More about PerformanceNavigation object returned by performance.navigation
I am doing some twitter authentication in classic asp (I know, but I can't change it). What I am doing is opening an authentication page in a popup via jQuery/JS with window.open that handels all of the rest/oauth authentication and then returns to the same page with the oauth keys I need. I would then like to close the popup and fire off some jQuery hide/show events without refreshing the page.
Code to fireoff the popup and authentication script:
jQuery(document).ready(function() {
jQuery("#twitter-button").live("click", function() {
jQuery("#twitter-button").attr("value", "Processing");
jQuery("#twitter-button").removeClass();
jQuery("#twitter-button").addClass("twitter-button-processing");
window.open('authentication.asp','_blank','width=600,height=400');
return false;
});
});
I then have the following code on the same page nested in some ASP for when we are redirected back:
if Session("OAUTH_TOKEN") <> "" And Session("OAUTH_TOKEN_SECRET") <> "" Then
%>
<script type="text/javascript" charset="utf-8" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
window.close();
// I'd like to show/hide new buttons on the parent page here
});
</script>
<%
End If
The goal is to change the button with a class of twitter-button-processing displaying none but I can not get it to change in the parent window. I have tried placing jQuery('.twitter-button-processing').hide(); in a jQuery(window).unload() function after the close but this did not produce the correct result.
I tried the solutions from Binding jQuery event on a child window and How to run function of parent window when child window closes? to no avail. Any help would be fantastic.
So I ended up pinpointing the answer on my own. Instead of redirecting back to the same page which was getting messy, I am redirecting to a blank page from the twitter popup window with some classic ASP that checks a few session variables.
Main File
var someFunction = function(data){
//some functionality
}
Twitter Popup Redirect window in the asp checks
window.opener.someFunction();
window.close();
This did exactly what I needed to do by calling the JS on the parent window while closing the child. Maybe this will help someone else.
I have an event called SubmitResponse().
A user is presented with a list of questions and possible responses. After completing the responses, the user clicks the Preview button. If responses are correct, the user clicks the SubmitResponse button and then SubmitResponse() processes it.
Upon clicking the SubmitResponse button, a print screen pops up for the user to print a copy. This is the calling code for the JS print feature.
finsub.Attributes.Add("OnClick", "print_form()")
Works fine but there is one problem. We would like the user to be redirected to the screen that displays results of his/her response with the code below.
Response.Redirect("results.aspx")
What is happening is that once the user clicks the submitResponses button, s/he is immediately redirected to the results.aspx page and the print feature is no longer available.
Is there a way to work around this?
You can do the printing and redirect all via javascript. Here is an example that should work:
function doPrint() {
window.print();
document.location.href = "Somewhere.aspx";
}
Link it to a Button:
<asp:Button ID="btnPrint" runat="server" Text="Print"
OnClientClick="doPrint(); return false;" />
For cross browser compatibility, you need to introduce a delay between the window.print() call and the redirect.
I find the following works well (using JQuery framework to print a page as soon as it loaded):
<script type="text/javascript">
$(document).ready(function () {
window.print();
setTimeout("closePrintView()", 3000);
});
function closePrintView() {
document.location.href = 'somewhere.html';
}
</script>
This can be easily adapted for "Print" buttons and links etc.
you can use this code :
window.print();
window.onafterprint = function(event) {
window.location.href = 'index.php'
};
using window.print() callBack!!
Redirect on client side using javascript/jQuery
onclick="window.print();window.location.href='results.aspx';"
For your case
insub.Attributes.Add("OnClick", "print_form();window.location.href='results.aspx';")
<script type="text/javascript">window.location = 'url.aspx';</script>