Nivetha Chezhian Nivetha Chezhian - 5 months ago 9
HTML Question

How to get the row wise and column wise table data of a selected cell in js

This is a table designed using HTML

Hi,
In this table any cell can be selected by the user(even multiple cells).What i need is that once the submit button is pressed the corresponding row wise and column wise table data i.e B and 1pm as of this example must be stored in the database.

<script type="text/javascript">
function change()
{
var cells = document.querySelectorAll("td");

for (var i = 0; i < cells.length; i++) {
cells[i].addEventListener("click", function() {
this.className= this.className == "white" ? "green" : "white";
});
}
}

function alert()
{
var cells = document.querySelectorAll("td");

for(var i=0;i<cells.length;i++)
{
if(cells[i].className.match("green"))
{
document.getElementById('p1').innerHTML="Appointment fixed";

}

}

}

</script>


This is the js for cell selection and alert message on submit if any one of the cells is selected

I'm new to js,so someone kindly help me out with this.Thankyou.

Answer

In the HTML of each td element you can save its column name and row name like this

<td data-r="Fairlands_B" data-c="1pm" class="green"></td>

Then to get the row and column data out of the clicked td:

var place=this.dataset.r;
var time=this.dataset.c;
Comments