I am trying to refresh a php script to show updated content as a database updates. I first built my php, then the code to refresh and then merge them. However, the script doesn't update. Anyone know why?
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(
function() {
setInterval(function() {
if(document.getElementById('gallery') != null){
function showLots() {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("gallery").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","getuser.php",true);
xmlhttp.send();
}
}
}, 3000);
});
</script>
Thanks.
The issue with your code is that function showLots()
is inside your if (document.getElementById('gallery') != null)
conditional without the function actually executing.
Below is what your corrected code could could look like by moving the function showLots()
definition up. showLots()
is then called inside where you originally had the definition.
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
function showLots() {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("gallery").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","getuser.php",true);
xmlhttp.send();
}
$(document).ready(function () {
setInterval(function () {
if (document.getElementById('gallery') !== null) {
showLots();
}
}, 3000);
});
</script>
You did not called method showLots
, First define it outside the function and than call it in setInterval