Get column value onclick HTML table

Question

I have this html table:

tabela

   |A|B|C|D|
   _________
001|M|N|O|P|
002|R|S|T|U|

And with this script I can get the row 1st value, e. onclick N get the value 001

var table = document.getElementById("tabela");
var rows = table.rows;
for (var i = 1; i < rows.length; i++) {
    rows[i].onclick = (function() {
        var rowid = (this.cells[0].innerHTML); 
        window.location.href = "next.php?rowidphp="+ rowid;
               });
            }

The thing is that I need to get the column 1st value, e. onclick N shuld get the value B

I'm trying everything but I can reach the point.....

What will be clicked and what value you want? I am not clear on what you need — Dalorzo, May 31 '14 at 15:25

score 3 · Accepted Answer · answered May 31 '14 at 15:25

3

Here's the fiddle: http://jsfiddle.net/t7G6K/

var table = document.getElementById("tabela");
var rows = table.rows;
for (var i = 1; i < rows.length; i++) {
    rows[i].onclick = (function (e) {
        var rowid = (this.cells[0].innerHTML);
        var j = 0;
        var td = e.target;
        while( (td = td.previousElementSibling) != null ) 
            j++;
        alert(rows[0].cells[j].innerHTML);
    });
}

answered May 31 '14 at 15:25

kidwon

4,448
5
28
45

This is just a simple example, however. It's not cross browser. I guarantee only modern browsers. – kidwon May 31 '14 at 15:30
when i can. the +1 is granted – malaquiastimoteo May 31 '14 at 17:41

score 0 · Answer 2 · answered May 31 '14 at 15:52

0

Try this:

table = document.getElementById("tablea");
var rows = table.rows;
for (var i = 1; i < rows.length; i++) {
    rows[i].cells[2].onclick = function (e) {
        rowid = e.target.previousElementSibling.previousElementSibling.textContent;
        alert(rowid);
    };
}

Here is the Demo

answered May 31 '14 at 15:52

super

2,288
2
21
23

this is what I have in other aplications, find the row..... I need to find the column – malaquiastimoteo May 31 '14 at 17:37

Erik Simonic · Answer 3 · 2014-05-31T17:02:39.513

0

jsFiddle http://jsfiddle.net/2dAkj/9/#

Ok with jQuery i would do it like this.

$(function () {
    $('table').on('click', function (e) {
        var x = $(e.target);
        var index = x.parents('tr').find('td,th').index(x);
        alert($(x.parents('table').find('tr').first().find('td,th')[index]).text());
    });
});

edited May 31 '14 at 17:02

answered May 31 '14 at 15:55

Erik Simonic

457
3
13

works just like the 1st ansewer, tks. the +1 is granted when I get the reputation to that. – malaquiastimoteo May 31 '14 at 17:43

Get column value onclick HTML table

3 Answers3

Linked