I'm creating an ESP8266 server with Arduino.
The code part is OK but when comes to JavaScript and HTML, things get a little problematic. The problem is that when the onClickEvent()
function sends the last number, instead of the number of the row and column. Here's an example:
The javaScript part:
<script>
var table = document.getElementById("tableID");
var lastTable = table;
if (table != null) {
for (var i = 0; i < table.rows.length; i++) {
for (var j = 0; j < table.rows[i].cells.length; j++) {
table.rows[i].cells[j].onclick = function () {
tableText(this);
sendData(i, j);
};
}
}
}
function sendData(i, j) {
var lpathname = location.pathname;
if (lpathname.indexOf("/X") > 0) {
location.href -= lpathname.slice(-6);
}
// location.href += ("/X" + i + "&Y" + j);
console.log("/X" + i + "&Y" + j);
}
function tableText(tableCell) {
if (tableCell.classList.contains("parede")) {
} else if (tableCell.classList.contains("robo")) {
lastTable.setAttribute("class", "");
} else {
tableCell.setAttribute("class", "destino");
lastTable.setAttribute("class", "");
lastTable = tableCell;
}
}
</script>
This is the HTML code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset=\"UTF-8\">
<title>Controle do Robô</title>
</head>
<body>
<h1>Controle do Robô</h1>
<div>
<div class="container">
<div class="col">
<p class="parede" id="texto">Parede</p>
<p class="obstaculo" id="texto">Obstaculo</p>
<p class="robo" id="texto">Robo</p>
<p class="destino" id="texto">Destino</p>
</div>
</div>
<table id="tableID">
<tbody>
<tr id="X0">
<td id="Y0">01</td>
<td id="Y1">02</td>
<td id="Y2">03</td>
</tr>
<tr id="X1">
<td id="Y0">11</td>
<td id="Y1">12</td>
<td id="Y2">13</td>
</tr>
<tr id="X2">
<td id="Y0">21</td>
<td id="Y1">22</td>
<td id="Y2">23</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
The result from JS when clicking in any cell of the table is always the max number (in the resumable example 3 - in the complete version is 10 because I use a 10x10 table)
//This is always the output
console.log("/X" + i + "&Y" + j); == /X3&Y3
I wanna the code to return /X2&Y1
for example, or /X0&Y3
. Can anyone help me to correct this?