problem in : Displaying an image and autorefresh it for every 30 seconds

10 New Member

[HTML]<HTML>
<HEAD>
<SCRIPT type="text/javascript">
var ld;
function func1()
{
var l=document.form1.loc.value;
var d=document.form1.degree.value;
ld=l+d;
func2();
}
function func2()
{
if (ld==chennaigrad)
{
var graph='<table> <tr><td> <img src="..... some url , which returns an image got from webservices"' >
document.writeln(graph);
document.close();
}
}
window.setInterval("func2();",30000);
</SCRIPT>
</HEAD>

<BODY>
<TABLE>
<FORM name="form1" action="" method="GET" onSubmit="func1();">

<SELECT name="loc">
<OPTION value="hyderabad">Hyd</OPTION>
<OPTION value="banglore">Bang</option>
<OPTION value="chennai">Madras</option>
</SELECT>

<SELECT name="degree">
<OPTION value="grad">B.Tech</OPTION>
<OPTION value="postgrad">M.Tech</option>
</SELECT>

<TD><input type='submit' value='Go'></TD>

</TR>
</FORM>
</TABLE>
</BODY>
</HTML>[/HTML]

Mar 12 '08 #1

Subscribe Reply

2544

gits

5,390

Recognized Expert Moderator Expert

you shouldn't use document.write after the page is loaded ... use innerHTML instead

kind regards

Mar 12 '08 #2

alexscript

New Member

Thank You, I have included innerHtml now.
The problem is when i execute this in my firefox, The images are not gettinng refreshed(i mean window.setInterval() is not working). And i tried putting
<meta http-equiv="Refresh" content="30;URL=project.html"> but this is returning to the main page ie., It will again ask me to select the dropdownlist(assuming this code is named as project.html).

Is there any way ,where i can refresh only images directly. (Or )
As below, i should be able to call a function every 30seconds, ( but it is not getting the new data in this case.) When i execute this in my internet explorer, i am able to see that the images are being refreshed every 30 seconds, but to my surprise i dont see any changes in the image. I am using webservices link as image, where the url remains remain, but the graph keeps changing, but in this case it is redrawing the old image not getting the new image. When i again click on the submit button, i am able to see the new image.

Help me out..

[HTML]<HTML>
<HEAD>
<SCRIPT type="text/javascript">
var ld;
function func1()
{
var l=document.form1.loc.value;
var d=document.form1.degree.value;
ld=l+d;
func2();
}
function func2()
{
if (ld==chennaigrad)
{
var graph='<table> <tr><td> <img src="..... some url , which returns an image got from webservices"' >

var d=document.getElementId("sometext");
d.innerHTML=graph;

}
}
window.setInterval("func2();",30000);
</SCRIPT>
</HEAD>

<BODY>
<TABLE>
<FORM name="form1" action="" method="GET" onSubmit="func1();">

<SELECT name="loc">
<OPTION value="hyderabad">Hyd</OPTION>
<OPTION value="banglore">Bang</option>
<OPTION value="chennai">Madras</option>
</SELECT>

<SELECT name="degree">
<OPTION value="grad">B.Tech</OPTION>
<OPTION value="postgrad">M.Tech</option>
</SELECT>

<TD><input type='submit' value='Go'></TD>

</TR>
</FORM>
</TABLE>

<div id="sometext">

</BODY>
</HTML>[/HTML]

Mar 13 '08 #3

gits

5,390

Recognized Expert Moderator Expert

first check this:

Expand|Select|Wrap|Line Numbers

if (ld == 'chennaigrad')

kind regards

Mar 13 '08 #4

alexscript

New Member

Sorry, That was my typing mistake here.

I kept those already in my program.

But still its not working..

Mar 14 '08 #5

gits

5,390

Recognized Expert Moderator Expert

you have the following errors:

please fix func2 so that graph is valid html and the method is getElementById():

Expand|Select|Wrap|Line Numbers

 
function func2() {

    if (ld=='chennaigrad') {

        var graph ='<table><tr><td><img src="..... some url , which returns an image got from webservices"/></td></tr></table>';
 
        var d = document.getElementById("sometext");

        d.innerHTML = graph;

    }

    window.setInterval("func2();",30000);

}

next fix your div to a valid node:

[HTML]<div id="sometext"></div>
[/HTML]
kind regards

Mar 14 '08 #6

alexscript

New Member

I did so, and i still has the problem.

Is there any way where i can reload only my images?

Here I am Calling a function for every 30 seconds and iam displaying those images in that function .

The main problem is , I am able to see the image for the first time when i click on the button, but later the function is being called but i dont see that the image is again the same. Its not getting updated?? is this any cache problem or so?? if so , how can i overcome it??

Thanks
--Alex.

Mar 14 '08 #7

gits

5,390

Recognized Expert Moderator Expert

add a unique querystring to the src:

Expand|Select|Wrap|Line Numbers

src = '"your_img_src?d=' + (+ new Date) + '"';

kind regards

Mar 14 '08 #8

alexscript

New Member

I changed the code accordingly, but as i am using webservices url, it doesnot end with some .jpg or .gif etc., and when i am using this code for that source, i am unable to see the image at all.

What does this date function do. where can i specify the delay as 30 seconds in this. ?

[HTML]<HTML>
<HEAD>
<SCRIPT language="JavaScript" type="text/javascript">
function func()
{

var source='"http://weeklyrose.com/images/roses.jpg?d="' + (+ new Date ) + '"';
var text='<table border="0" bordercolor="FFCC00" style="background-color:FFFFCC" width="100%" border="4" cellpadding="3" cellspacing="3"><tr><td> <img src='+source+'> </img></td></table>';

var d=document.getElementById("sometext");
d.innerHTML=text;

}

window.setInterval("func1()",30000);

</SCRIPT>
</HEAD>
<BODY>
<div id="sometext">
</div>

</BODY>
</HTML>[/HTML]

Mar 15 '08 #9

Similar topics

autorefresh aspx

by: Just D | last post by:

Hi, I know how can I cache the ASPX page or any control on this page. But how can I refresh ASPX page automatically every xx seconds? Any script? I need my application to go to the server and...