Putting a variable http address into an iframe with auto refresh
Hi
I am trying to put a http address into an Iframe. The Iframe will need to be refreshed every 5 minutes (this is currently working).
My problem is that I cannot get the http address into the Iframe to work, it’s just blank.
The data displayed in the Iframe is real time thus the refresh every 5 minutes.
Unfortunately I cannot test this due to security unless I am at work so have used a set of images with different dates as file names but the process should be the same(I hope).
Any help would be much appreciated.
Regards
Stubyh
my code so far
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<!-- just display the date so I know the date script is working ok -->
<form name="dform">
<input type="text" name="currentdate" size=11> </form>
<script>
/*Current date in form dform:
*/
var mydate=new Date()
var theyear=mydate.getYear()
if (theyear < 1000)
theyear+=1900
var theday=mydate.getDay()
var themonth=mydate.getMonth()+1
if (themonth<10)
themonth="0"+themonth
var theday=mydate.getDate()
if (theday<10)
theday="0"+theday
//////EDIT below three variable to customize the format of the date/////
var displayfirst=themonth
var displaysecond=theday
var displaythird=theyear
// local testing
var urlTxt="http://localhost/adalex/"
var urlTxt1=displayfirst
var urlTxt2="_"
var urlTxt3=displaysecond
var urlTxt4="_"
var urlTxt5=displaythird
var urlTxt6=".jpg"
// put the date into dfrom
document.dform.currentdate.value=displayfirst+"_"+displaysecond+"_"+displaythird
// merge all the variables above into one string
var urlTxt7=urlTxt+urlTxt1+urlTxt2+urlTxt3+urlTxt4+urlTxt5+urlTxt6
// display that string onto the page so I know I have the right string
document.write(urlTxt7)
//put the string into myframe --- not sure if this is working -- removed for now
//document.getElementById("myframe").src = urlTxt7
</script>
<script type="text/javascript">
function init() {
//put the string into myframe --- not sure if this is working
var url = urlTxt7;
document.getElementById("myframe").src = url;
}
</script>
<script>
/*
Auto Refresh Page with Time script
*/
//enter refresh time in "minutes:seconds" Minutes should range from 0 to inifinity. Seconds should range from 0 to 59
var limit="5:00"
if (document.images){
var parselimit=limit.split(":")
parselimit=parselimit[0]*60+parselimit[1]*1
}
function beginrefresh(){
if (!document.images)
return
if (parselimit==1)
window.location.reload()
else{
parselimit-=1
curmin=Math.floor(parselimit/60)
cursec=parselimit%60
if (curmin!=0)
curtime=curmin+" minutes and "+cursec+" seconds left until page refresh!"
else
curtime=cursec+" seconds left until page refresh!"
window.status=curtime
setTimeout("beginrefresh()",1000)
}
}
window.onload=beginrefresh
</script>
</head>
<!-- display the iframe on the page, desplay a picture depending on what the date is
auto refresh of the page allows for the image to change when it has gone passed midnight -->
<body onLoad="init()">
<iframe id="myframe" frameborder="1" height="100%" width="100%" src=""></iframe>
<p>
Some older browsers don't support iframes. If they don't, the iframe will not be visible.
</p>
</body>
</html>
is this code close to what you are trying? has done some change, hope you understand what it do:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<!-- just display the date so I know the date script is working ok -->
<form name="dform">
<input type="text" name="currentdate" size=11> </form>
<script>
var mydate=new Date()
var ymd = []; // year, month, date;
ymd.push(mydate.getFullYear());
ymd.push((mydate.getMonth() + 1 < 10)? '0'+ (mydate.getMonth()+1): mydate.getMonth()+1);
ymd.push((mydate.getDate() < 10)? '0'+mydate.getDate(): mydate.getDate());
/////EDIT below three variable to customize the format of the date/////
var urlTxt7 = "http://localhost/adalex/" + ymd.join("_") + ".jpg";
document.dform.currentdate.value= ymd.join("_");
document.write(urlTxt7);
function init() {
document.getElementById("myframe").src = urlTxt7;
}
//enter refresh time in "minutes:seconds" Minutes should range from 0 to inifinity. Seconds should range from 0 to 59
var limit="5:00";
var parselimit=limit.split(":");
parselimit=parselimit[0]*60+parselimit[1]*1;
function beginrefresh(){
if (!parselimit){
init();
parselimit=limit.split(":");
parselimit=parselimit[0]*60+parselimit[1]*1;
setTimeout("beginrefresh()",1000);
}else{
parselimit-=1;
curmin=Math.floor(parselimit/60);
cursec=parselimit%60;
if (curmin!=0)curtime=curmin+" minutes and "+cursec+" seconds left until page refresh!";
else curtime=cursec+" seconds left until page refresh!";
window.status=curtime;
setTimeout("beginrefresh()",1000);
}
}
window.onload= function(){
beginrefresh();
init();
}
</script>
</head>
<!-- display the iframe on the page, desplay a picture depending on what the date is
auto refresh of the page allows for the image to change when it has gone passed midnight -->
<body>
<iframe id="myframe" frameborder="1" height="100%" width="100%" src=""></iframe>
<p>
Some older browsers don't support iframes. If they don't, the iframe will not be visible.
</p>
</body>
</html>
Last edited by ZeroKilled; 10-26-2008 at 06:56 PM.
my mom is javascript, dad is javascripter, granpa is javascriptor, and my little sister is javasRidiculous. my nature language is javascript, then come spanish and english -- me
many thanks ZeroKilled, code put the picture in the frame which has saved me many hours of staring at the computer, but it did not for some reason auto refresh after the 5 min.
But I have managed to resolve this.
here is my final code. again many thanks
Regards
Stubyh
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<!-- just display the date so I know the date script is working ok -->
<form name="dform">
<input type="text" name="currentdate" size=11> </form>
<script>
var mydate=new Date()
var ymd = []; // year, month, date;
// modified to show as USA date format month/day/year;
ymd.push((mydate.getMonth() + 1 < 10)? '0'+ (mydate.getMonth()+1): mydate.getMonth()+1); //month;
ymd.push((mydate.getDate() < 10)? '0'+mydate.getDate(): mydate.getDate()); // day
ymd.push(mydate.getFullYear()); // year;
/////EDIT below three variable to customize the format of the date/////
var urlTxt7 = "http://localhost/adalex/" + ymd.join("_") + ".jpg";
document.dform.currentdate.value= ymd.join("_");
document.write(urlTxt7);
function init() {
document.getElementById("myframe").src = urlTxt7;
}
//enter refresh time in "minutes:seconds" Minutes should range from 0 to inifinity. Seconds should range from 0 to 59
var limit="5:00"
if (document.images){
var parselimit=limit.split(":")
parselimit=parselimit[0]*60+parselimit[1]*1
}
function beginrefresh(){
if (!document.images)
return
if (parselimit==1)
window.location.reload()
else{
parselimit-=1
curmin=Math.floor(parselimit/60)
cursec=parselimit%60
if (curmin!=0)
curtime=curmin+" minutes and "+cursec+" seconds left until page refresh!"
else
curtime=cursec+" seconds left until page refresh!"
window.status=curtime
setTimeout("beginrefresh()",1000)
}
}
window.onload= function(){
beginrefresh();
init();
}
</script>
</head>
<!-- display the iframe on the page, desplay a picture depending on what the date is
auto refresh of the page allows for the image to change when it has gone passed midnight -->
<body>
<iframe id="myframe" frameborder="1" height="100%" width="100%" src=""></iframe>
<p>
Some older browsers don't support iframes. If they don't, the iframe will not be visible.
</p>
</body>
</html>
Bookmarks