Creé una tabla HTML donde algunos valores se pueden cambiar usando un control deslizante. El problema es que cuando trato de recuperar el valor de la tabla, los cambios no se guardan.

Mi objetivo sería recuperar el valor de la tabla HTML para luego calcular un producto escalar de cada fila con otra matriz.

Este es el código HTML que he usado para crear el control deslizante y la tabla.

 <input type="range" name="mySlider" id=mySlider min="0" max="1" step="0.1" value="0.5", onchange="updateSlider(this.value)"> <div id="sliderAmount"></div> <table id = "user_feature"> <tr> <th>User</th> <th>Feature One</th> <th>Feature Two</th> </tr> <tr> <td>Anna</td> <td>0.3</td> <td>0.4</td> </tr> <tr> <td>Jonny</td> <td>0.7</td> <td>0.1</td> </tr> </table>

Y este es el código JS que he usado para cambiar el valor de una celda, recuperar los valores de la tabla (la implementación actual no captura los cambios) y crear una sola matriz y no una para cada fila.

 function updateSlider(slideAmount) { var cell_change = document.getElementById("user_feature").rows[1].cells; cell_change[1].innerHTML = slideAmount; } var matrix = []; var oTable = document.getElementById('user_feature'); //gets rows of table var rowLength = oTable.rows.length; //loops through rows for (i = 1; i < rowLength; i++) { //gets cells of current row var oCells = oTable.rows.item(i).cells; //gets amount of cells of current row var cellLength = oCells.length; //loops through each cell in current row for (var j = 0; j < cellLength; j++) { var cellVal = oCells.item(j).innerHTML; matrix.push(cellVal); } }