Getting table row data jQuery

Question

Just want to get the table row data and pass it. In my code it seems that it only getting first row data.

$(".edit").click(function(){
    var tableData = $('tr.table').children("td").map(function() {
        return $(this).text();
    }).get();

  $('#test1').val($.trim(tableData[0]));
  $('#test2').val($.trim(tableData[1]));
  $('#test3').val($.trim(tableData[2]));
})

It's a bit unclear what you want. I assume you want to get the row the clicked .edit element is contained in? $('tr.table').children("td") gets all td element of the whole table. — Felix Kling
– Felix Kling, Commented Nov 29, 2013 at 8:34

Tushar Gupta - curioustushar · Accepted Answer · 2013-11-29 08:39:07Z

1

Try

fiddle Demo

var tableData = $(this).closest('tr.table').children("td").map(function () {
    return $(this).text();
}).get();

Change

$('tr.table').children("td") 

//will get all tr.table and it's children td

to

$(this).closest('tr.table').children("td") 

//this will get closest tr to the current edit button

.closest()

edited Nov 29, 2013 at 8:39

answered Nov 29, 2013 at 8:34

Tushar Gupta - curioustushar

57.2k24 gold badges106 silver badges110 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Felix Kling Over a year ago

Please explain the problem and your solution, do not only post code.

Tushar Gupta - curioustushar Over a year ago

@FelixKling Done Sir .I was updating answer.

Rituraj ratan · Accepted Answer · 2013-11-29 08:34:14Z

1

$(".edit").click(function(){
    var tableData = $(this).closest("tr").children("td").map(function() {
     // by $(this) go to current td then by closest go its closest "tr" then find their td        
        return $(this).text();
    }).get();

  $('#test1').val($.trim(tableData[0]));
  $('#test2').val($.trim(tableData[1]));
  $('#test3').val($.trim(tableData[2]));
});

update fiddle

reference closest()

answered Nov 29, 2013 at 8:34

Rituraj ratan

10.4k8 gold badges38 silver badges55 bronze badges

1 Comment

Felix Kling Over a year ago

Please explain the problem and your solution, do not only post code.

Collectives™ on Stack Overflow

Getting table row data jQuery

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related