0

Hi All,

At the minute I have a script, that ill post below, that simple echos out some information via ajax.

My question is, how do i get the update without using meta refresh and without clicking anything at all?

<html>
<head>
<script type="text/javascript">
function showHint(str)
{

  if (window.XMLHttpRequest)
    xmlhttp = new XMLHttpRequest();
  else
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

  xmlhttp.onreadystatechange = function()
  {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
      document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
  };
  xmlhttp.open("GET", "timer1.php" + str, true);
  xmlhttp.send(null);
}
</script>
</head>
<body>
<meta http-equiv="refresh" content="1;url=ajax1.php">
<form action=""> 
<input type="hidden" id="txt1" onkeyup="showHint(this.value);" />
</form>
<p><span id="txtHint"></span></p> 

</body>
</html>

<script type="text/javascript">

showHint("");
</script>
<?php
getConnection();
$SQL = "SELECT email FROM tbl_emailtest ORDER BY email ASC";
$result = mysql_query($SQL);
while ($row = mysql_fetch_array($result)){
	echo $row['email'];
	echo "<br>";
}
?>
2
Contributors
5
Replies
6
Views
7 Years
Discussion Span
Last Post by whiteyoh
0

You could use setTimeout() or setTimeinterval() in order to keep calling your Ajax script function (showHint()). You could change the bottom of your page from

<script type="text/javascript">
showHint("")
</script>

to somewhat like (not the best coding, but just to give you an idea)

<script type="text/javascript">
function keepCalling() {
  showHint("")
  window.setTimeout("keepCalling()", 1000)  // call the showHint every 1 second
}

keepCalling()
</script>

Edited by Taywin: n/a

0

that works a treat, thank you. can you think of any methods that would do the same without the page flickerng?

0

I do not know how big the area in a page that you keep the update on. The bigger the area is, the more flickering you would see. Also, the time interval of updating could impact the flickering as well. You may lengthen the time if you want, but it depends on your application. I am not sure whether or not your ajax call (time1.php) requires to be every second.

0

The amount of data used is only a small amount. I wonder how a clock can update itself without any flicker, yet a few records of data causes a whole screen to refresh?

Are there any tips out there to minimise this?

<script>function showhint(str) {
               
            original_content = document.getElementById(divID).innerHTML; // NewLine!
            
            var XMLHttpRequestObject = false;

               if (window.XMLHttpRequest) {
                       XMLHttpRequestObject = new XMLHttpRequest();
                       } else if (window.ActiveXObject) {
                       XMLHttpRequestObject = new
                       ActiveXObject("Microsoft.XMLHttp");
                       }


               if(XMLHttpRequestObject) {
               var obj = document.getElementById(divID);
            document.getElementById(divID).innerHTML = original_content; // Altered line to not show 'nothing'

                       XMLHttpRequestObject.open("GET", "console1.php, true);
                       XMLHttpRequestObject.onreadystatechange = function()
                       {

                               if (XMLHttpRequestObject.readyState == 4 &&
                                       XMLHttpRequestObject.status == 200) {
                                       obj.innerHTML = XMLHttpRequestObject.responseText;
                                       delete XMLHttpRequestObject;
                                       XMLHttpRequestObject = null;
                                       }
                       }
               XMLHttpRequestObject.send(null);
               }
       }
</script>
<script>showHint(this.value)</script>
<script type="text/javascript">
      function keepCalling() {
      showHint("")
      window.setTimeout("keepCalling()", 1000) // call the showHint every 1 second
      }
      keepCalling()
</script>
0

hi all, Been playing around and got it to refresh with no flickering.

In the code is a scroll bar. Is there anyway i can temporarily cancel the refresh if i were to click on the scroll bar, then resume on clicking away?

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.