StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POStop page refresh
text
Body
copied!<p>I'm writing a small piece of code which takes input from a user via html form to then retrieve information (in xml) from a server (which is running locally) using <strong>XMLHttpRequest</strong>, once I get the information I output it into a list using the method I've written for the <strong>onreadystatechange</strong>. However once it's written the list to the page it automatically refreshes the page and the list disappears. I'm absolutely lost as to why it is doing this?! I've managed to forcefully stop the page refreshing using <strong>window.onbeforeunload</strong> and stopping the refresh, but I can't help but think there is a better way around this and that I must be doing something wrong. My code is as follows:</p> <pre><code>var xmlhttp=null; </code></pre> <p>function byObserver(){</p> <pre><code>var a = document.forms["byObserverForm"]["observerName"].value; a = encodeURIComponent(a); if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); }else{// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } if (xmlhttp) { xmlhttp.onreadystatechange = onReadyStateByObserver; xmlhttp.open("GET","http://localhost:8004/birdobs/observer/" + a, false); xmlhttp.send(); } return false; </code></pre> <p>} </p> <pre><code>function onReadyStateByObserver(){ if (xmlhttp.readyState == 4){ if (xmlhttp.status == 200){ var xmlDoc = xmlhttp.responseXML; var observations = xmlDoc.getElementsByTagName("observation"); if (observations.length != 0){ // output into unordered list var f = document.createDocumentFragment(); var e = document.createElement("ul"); f.appendChild(e); var ul = f.firstChild; for (i = 0; i<observations.length; i++) { var li = document.createElement("li"); var te = document.createTextNode(observations[i].getAttribute("observer")); li.appendChild(te); ul.appendChild(li); } // end for document.getElementById("content").appendChild(f); window.onbeforeunload = function(){ return "Refresh"; } } } } //have also tried return false here </code></pre> <p>}</p> <p>Any help would be highly appreciated as I've spent so long trying to fix this, many thanks in advance! (I haven't included the HTML as I thought it wasn't needed, but please ask if it would help and I'll post it up!) I'll just finally add I'm running this in chrome.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload