Menu
We are getting a weird issue on which we are not sure what exactly cause it. Let me elaborate the issue. Suppose, we have two different html pages a.html and b.html. And a little script written in index.html:
<html>
<head>
<script>
function reloadFrame(iframe, src) {
iframe.src = src;
}
</script>
</head>
<body>
<form>
<iframe id="myFrame"></iframe>
<input type="button" value="Load a.html" onclick="reloadFrame(document.getElementById('myFrame'), 'a.html')">
<input type="button" value="Load b.html" onclick="reloadFrame(document.getElementById('myFrame'), 'b.html')">
</form>
</body>
</html>
A server component is continuously updating both files a.html and b.html. The problem is the content of both files are successfully updating on the server side. If we open we can see the updated changes but client getting the older content which doesn't show the updated changes.
Any idea?
339
reload() will reload the iframe. This works from JavaScript inside the current iFrame.
Loading the iframe content makes the browser cache the page in it, so that if you load it a second time later, the browser will simply fetch it from cache, unless your server is set up to always load the content afresh.
To clear the content of an iframe with JavaScript, we call write to write an empty string. const iframe = document. getElementById("myiframe"); const html = ""; iframe.
Add this in a.html and b.html
<head>
<meta http-Equiv="Cache-Control" Content="no-cache" />
<meta http-Equiv="Pragma" Content="no-cache" />
<meta http-Equiv="Expires" Content="0" />
</head>
To force no cache checks
98
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
