Using XMLHttpRequest - refresh intervals

Question

4.50/5 (2 votes)

See more:

Because the previous post I did had some many objectives, I decided to create this one (one step at the time).

So my question is:

- A user login in to a page.
- The page has a text section which any logged in user can change.
- The content of that section is inside XML and when user change the content the XML file is rewritten. The user that changes the content has a button that executes the script below, so the changes are imediatelly shown.

The problem is, other user with the page opened, dont see the change in real time (or something near it). What I need is to refresh that div and I dont know how to do that. For example I want to refresh the readed content of the xml every 2 seconds. I know this is not very efficient and hasnt many practical value, but I want to apply this principle in a game by turns - so I need to learn how to update (only the div, not the entire page)

I suppose I should use setInterval(callServer, REFRESH_PERIOD_MILLIS);

But how should I apply it? If I use it I dont reload the whole page?

XML

  <script type="text/javascript">
      function loadXMLDoc() {
          var xmlhttp;
          if (window.XMLHttpRequest) {
              xmlhttp = new XMLHttpRequest();
          }
          else {// code for IE6, IE5
              xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
          }
          xmlhttp.onreadystatechange = function () {
              if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    // change content from div
                  document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
              }
          }
          xmlhttp.open("GET", "info.xml", true);
          xmlhttp.send();
      }

      // first page load
      loadXMLDoc();
      setInterval(callServer, 30);
    
</script>
      

</head>
<body>


  <div id="myDiv"><h2> <% .... content read from xml file through ajax call %></h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>

is not there the input of the new content (which will be created using another ajax call to write on XML dont worry because that :)

----

I know this is no logic because I have that code inside a function (that's why the information dont reload if the xml is changed - but it was only a "try and error", appreciate any help.

Posted 24-Feb-11 6:48am

Maxdd 7

Updated 24-Feb-11 7:05am

v6

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

_Ashish · Accepted Answer · 2011-02-24T07:21:00

As far i understood you want to make a Ajax Timer which periodically run and Update a Section of the page based on the response received.

This is very well done through setInterval(func-name, interval-span);.
your code seems same what you want. check the following lines.

// first page load
loadXMLDoc();
setInterval(callServer, 30);

callserver is not a function you should call loadXMLDoc here

// first page load
loadXMLDoc();
setInterval(loadXMLDoc, 2000); // 2 seconds.

If it doesnt help please describe your problem with more detail.