reload only middle portion of web page without header and footer images

[tvnaidu]

I´m trying to display certain page without header image or footer image (I need to reload only variable values). Is there any way of disabling them in html code?, I am using refresh now, it reloads whole page, when it reloads I get one second white screen pf that page. my page looklike:


header.img

variable v1 = 9.0

variable v2 = 10.0


footer.img

[Death Slaught]

If I'm not mistaken you already have a similar thread to this posted. Please do not double post threads.

I'm assuming that you want your variables to update automatically? Without page refresh and without the user having to do anything. What are you currently doing/using to update the page (other than refreshing it)? Are the updated variables coming from a server?

Thanks, Death

[tvnaidu]

sorry fro that.

it is plain html code, I used refresh tag at the beginning to refresh page for every 5 seconds without user do anything, but this reload loads whole page, I can see blank page for a second.

[tvnaidu]

Yes, all varialbles coming from server (on network)

[Death Slaught]

Okay, as mentioned before you can use an iframe so only the variables are refreshed but that probably isn't what you're looking for -it's the same thing that you are already doing. However, this can be done by using, say PHP, to retrieve that data from the server and update the variables on the fly. I'm sure that other languages can achieve this, but I'm not entirely sure which ones.

Thanks, Death

[tvnaidu]

Thanks. MIne is very simple code, I just want to read values from http server and I need to update them without reload page. I am not familiar with html thatmuch. I have my code, can I post here, for some expert this may be simple, middle values I need to update.

[Death Slaught]

No problem, you can post your code if you want incase anyone else wants to throw anything else in. Like I said, this would probably be easiest to accomplish with PHP, so you might want to ask over there.

Thanks, Death

[tvnaidu]

This is running on micro-controller, it won't support CGI / PHP.

[Death Slaught]

Ah, that could present a problem. I'm sure there are plenty of work arounds. I'll ask a few people to take a look and see if they can help you.

Thanks, Death

[tvnaidu]

Thanks, appreciated. THis is my code (right now it reload the whole page include footer.gif and header.gif - also one second white page between reloads, I want to avoid that and reload only my values (Three volatges, four currents and four powers)

<html>

<head>
<meta http-equiv="refresh" content="10">
<title>BPS</title>
</head>

<body>

 &nbsp;  &nbsp;  &nbsp;  &nbsp;  &nbsp;  &nbsp;  
 <br>
<div id="header">
	<CENTER><a title="BPS"><img src="header.gif" alt="BPS" width="800" height="64" border="0" /></a> </CENTER>
</div> &nbsp;  &nbsp;  &nbsp; 

<div align="left">
	<a href="/plugv3.htm" onMouseOver="window.status='';return true;"><strong>Click here for Receptacle Controls</strong> </a>
 <br>
	<a href="/admin_status.html" onMouseOver="window.status='';return true;"><strong>Click here for Receptacle Status</strong> </a>
 <br>
	<a href="/board1_info.htm" onMouseOver="window.status='';return true;"><strong>Click here for Receptacle Currents & Powers</strong> </a>
</div>

<div align="center">
	<b><font size="3"> BOARD VOLTAGES (RMS), BOARD CURRENTS (RMS) and BOARD ACTUAL POWER readings </font></b>
	<br><br>
</div>
<br>
<br>

<div align="center">
<TABLE>
<tbody>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;FIRST BOARD (Receptacles 1-8) VOLTAGE (V1)   :  </strong></td><td>1     Volts</td> </tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;SECOND BOARD (Receptacles 9-16) VOLTAGE (V2) :  </strong></td><td>97    Volts</td></tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;THIRD BOARD (Receptacles 17-24) VOLTAGE (V3):  </strong></td><td>1     Volts</td></tr>
</tbody>
</TABLE>

<br>
<br>
<TABLE>
<tbody>

<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;FIRST BOARD TOTAL CURRENT (RMS):  </strong></td><td>0     </td><td>.</td><td>6     Amps</td></tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;SECOND BOARD TOTAL CURRENT (RMS):  </strong></td><td>0     </td><td>.</td><td>6     Amps</td></tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;THIRD BOARD TOTAL CURRENT (RMS):  </strong></td><td>0     </td><td>.</td><td>4     Amps</td></tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;TOTAL CURRENT (RMS):  </strong></td><td>0     </td><td>.</td><td>8     Amps</td></tr>


</tbody>
</TABLE>
<br>
<br>
<TABLE>
<tbody>

<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;FIRST BOARD POWER:  </strong></td><td>0     Watts</td></tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;SECOND BOARD POWER:  </strong> </td><td>4    Watts</td></tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;THIRD BOARD POWER:  </strong> </td><td>0    Watts</td></tr>
<tr><td><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;TOTAL BOARD POWER:  </strong> </td><td>4    Watts</td></tr>

</tbody>
</TABLE>
</div>






<br><br>

<div align="center">
	<input type="button" value="Refresh" onclick="window.location.reload();" />
</div>
<br><br><br>

<form name="input" action="/plug_login.htm" method="get">
<div align="center">
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="button" onclick="if (confirm('Sure you want to Logout?')) submit();" value="Logout"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
</div>
</form>

<br><br><br> 
<tr> <CENTER>
		<td align="center" width="100%" colspan="2">
			<img border="0" src="footer.gif" width="800" height="25"></td> </CENTER>
	</tr>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<td> .

[YarrOfDoom]

I believe the perfect way to solve this would be AJAX, as it is made for things like this. You might need to learn a little Javascript, but there's always the Javascript/AJAX/DHTML forum for that ;)

You can start learning AJAX here.

[tvnaidu]

Thanks. Let me learn littlebit AJAX and solve it.