In my retirement, I am building a local weather site. Data is loaded to a MySQL database. Everything works fine, so I wanted to add a previous and next buttons see past monthly data.
The data loads on initial page loading, but when I click the previous button the date changes, but the previous month data does not reload into the id tag.
Here is the code.
Can someone point to what I am not doing correctly?"
Thanks.
The data loads on initial page loading, but when I click the previous button the date changes, but the previous month data does not reload into the id tag.
Here is the code.
Code:
<body onload="loadDate()">
<div class='row'>
<div class='column left'> <a class="prevmonth" onclick="plusMonth(-1)">❮</a></div>
<div class='column middle' id="displaydate"></div>
<div class='column right'><a class="nextmonth" onclick="plusMonth(1)">❯</a></div>
</div>
<div id="tableWx"></div>
<script>
dt = new Date();
function loadDate() {
var engMonth = dt.toLocaleString('en-IT', { month: 'long' });
var year = dt.getFullYear();
document.getElementById("displaydate").innerHTML = engMonth+' '+year;
showWx();
}
</script>
<script>
function plusMonth(n) {
var month = dt.getMonth();
dt.setMonth(dt.getMonth() + n);
while (dt.getMonth() === month) {
dt.setDate(dt.getDate() - 1);
}
var engMonth = dt.toLocaleString('en-IT', { month: 'long' });
var year = dt.getFullYear();
document.getElementById("displaydate").innerHTML = engMonth+' '+year;
showWx();
}
</script>
<script>
function showWx() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("tableWx").innerHTML = this.responseText;
}
};
xmlhttp.open("GET","get_month_summary.php?q="+dt,true);
xmlhttp.send();
}
</script>
</body>Can someone point to what I am not doing correctly?"
Thanks.