I have an iframe that contains an upload.php file in my page. So i want my page to refresh once when an upload in the iframe is complete. However, my page refreshes continuously whether or not i have clicked the upload button..Help please
Here is my code...
<script>
var up = document.getElementById("upload");
function iloaded(){
window.location.reload();
}
up.onload = iloaded();
</script>
and here is the iframe
<iframe style="display:none" id="upload" src="upload.php"></iframe>
the upload is successful though but the page refresh is the issue here..
I have got the answer simply add this code to the upload.php file and leave out all the other js functions.
Here is the code..
if(upload==true){?>
<script>
window.top.location.reload();
</script>
<?php}?>
Does the job.
Related
I have a real .php page like this http://hiteachers.com/soccer_parse.php?id=5. I want to add it into a blogger.com new page (**not a new blog post, or new HTML widget **, and I've got this successfully.
https://tranbongda.blogspot.com/p/function-myfunction-window.html
I used the code like this:
<script>
var Window;
// Function that open the new Window
function windowOpen() {
Window = window.open("http://hiteachers.com/soccer_parse.php?id=5",
"_blank", "width=400, height=450");
}
// function that Closes the open Window
function windowClose() {
Window.close();
}
</script>
<button onclick="windowOpen()">Open page</button>
<button onclick="windowClose()">Close page</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script>
$(document).ready(function()
$("button").click(function(){
$("#div1").load("http://hiteachers.com/soccer_parse.php?id=5");
});
});
</script>
My expectation is that I'd like the blogger page to load the original content of the .php page immediately when the visitor visits the blogger.com page (https://tranbongda.blogspot.com/p/function-myfunction-window.html) without clicking on any button.
I have thought of creating iframe by using this:
<iframe name="Framename" src="http://hiteachers.com/soccer_parse.php?id=5" width="550" height="550" frameborder="0" scrolling="yes" style="width: 100%;"> </iframe>
But the blogger.com page does not accept it, and returns the error message like this:
This page contains HTTP resources which may cause mixed content affecting security and user experience if blog is viewed over HTTPS.
Then I moved to try this <object width="500" height="300" type="text/html" data="http://hiteachers.com/soccer_parse.php?id=5"></object> as per some bloggers' suggestions, but I still failed.
Some other bloggers suggested to use AJAX, which is very new to me.
So, is there any way to parse the provided .php page content and add it to the blogspot.com/blogger.com new page without showing the url of the .php page or window pop-ups?
Can you help me please?
Thanks
As the bloggers likely have suggested, make the PHP server a REST endpoint and access the data on the blog site with Asynchronous JavaScript and XML. Although today people have tended to scratch the XML part and go with JSON or something.
AJAX is accomplished by using the XMLHttpRequest object.
Mozilla's spec provides links and stuff which will show you how to use it
and w3schools is a good resource.
Then it's all comes down to editing the page directly
element.removeChild(element.lastChild);
element.appendAdjacentHTML('beforeend',xhr.responseText);
This program is working perfectly it load books.php data into div. There is a javascript code inside the loading page books.php but this javascript not running. How can I solve this problem?
<button onclick='change("books.php")'> Books </button>
<div id="myDiv"></div>
<script>
function change(value) {
$(document).ready(function() {
$("#myDiv").load(value);
});
}
</script>
</html>
move your JavaScript code from books.php to separate file and load it using
$.getScript("js file url");
My app is doing large amount of database queries and it holds the loading page blank white while doing it. I was wondering if there is anyway I can show the loading icon during the query.
<?php
//large queries
//if all queries pass
//do the redirect
header('Location: index.html');
//else show login screen.
?>
<html>
//show login screen….
</html>
My question is how to show the loading icon when php query database
Thanks.
redirect user to a loading page 2. make an ajax request to the actual content script (does the heavy lifting) 3. when content is ready replace part of the loading page with actual content
Example of a loading page: (index.php returns content of body -element for the page)
<script>
$(document).ready(function() {
$.get("index.php", function(data) {
$("body").html(data);
console.log("page was loaded");
});
});
</script>
<html>
<body>
page is loading // <- shown while loading the page
</body>
</html>
note: example above expects that jquery is included
Is there any other way to launch an automatic download. Currently we do it this way.
If download does not start click here:
Filename (121 MB)
And much later on in the page we have this code.
<script type="text/javascript">
window.onload=function(){
setTimeout(function(){
window.location.href='http://www.example.com/file.zip';},2000);
};
</script>
Problem is that it sometime launches the same file to download multiple times to end users. Is there a better way to do this?
One option is to have an IFrame hidden in page with src pointing to zip file to download.
<div style="display:none;">
<iframe id="frmDld" src="http://www.example.com/file.zip"></iframe>
</div>
Another option will be to write the file to response stream when sending the page back(Don't know what you are using on server side. If it is asp.net/mvc then I can help.).
If
Filename (121 MB)
works then this should work too:
<?php
echo "<META HTTP-EQUIV=\"refresh\" CONTENT=\"0; URL= http://www.example.com/file.zip \">";
?>
i am creating an ipad app
i have a side navigation, and then a main window. user will click links in the navigation and pages will load up in the main window.
i use ajax to dynamically load my pages in my main window, but when my pages load they do not load with their own css or js files, which i have linked in the page html file.
instead i belive they take on the CSS of the entire site.
i have read i can use 'loadobjs' to load my CSS and my page loads dynamically.
how can i use that with my code?
a reply will be greatly appreciated
thank you
code provided below:
$(document).ready(function(){
// load index page when the page loads
$("#main_content_inner").load("home.html");
$("#home").click(function(){
// load home page on click
$("#main_content_inner").load("home.html");
});
$("#latest").click(function(){
// load contact form onclick
$("#main_content_inner").load("latest.html");
});
$("#important").click(function(){
// load contact form onclick
$("#main_content_inner").load("important.html");
});
$("#personal").click(function(){
// load contact form onclick
$("#main_content_inner").load("personal.html");
});
$("#timetable").click(function(){
// load contact form onclick
$("#main_content_inner").load("timetable.html");
});
$("#tasks").click(function(){
// load contact form onclick
$("#main_content_inner").load("tasks.html");
});
$("#staff").click(function(){
// load contact form onclick
$("#main_content_inner").load("staff.html");
});
$("#university").click(function(){
// load contact form onclick
$("#main_content_inner").load("university.html");
});
});
This doesn't directly answer your question, but my recommendation is for the outer page's CSS to have all the necessary information for each child page you load.
Also, you shouldn't load entire HTML documents via AJAX; your DOM would end up looking something like this (which is bad)
<html>
<head>...</head>
<body>
<div id="ajax_panel">
<html>
<head>...</head>
<body> Content </body>
</html>
</div>
</body>
</html>
Instead, modify your inner documents to only contain the information that should be in your div#main_content_inner.