CODEWITHSUNDEEP
javascriptjquery
John Smith
John Smith

Reputation: 6259

Get values of tds in a table

Ok how you can see in my fiddle im trying to manipulate the left table, so that at the end it looks like the table on the right: http://jsfiddle.net/SULK3/2/

To do this i first try to get the values of the tds loop through them and look for the dates and change the rowspans upon the data i get: So i started with a normal table and this code:

var values = [];
   var table = $(this).closest("table");
   table.find("tr").each(function() {
      values.push($(this).find("td:first").html());
   });

$('#values').text(values);

But somehow it wont work, the values of the rows wont be outgiven in the div with the id values! Why? (If you have ideas how to solve my 'big'-problem please post it also here!) Thanks

Upvotes: 1

Views: 251

Answers (2)

Trevor
Trevor

Reputation: 16116

You are probably going to try to accomplish this with the array you are building. And just wanted to know why the values were not showing up in #values.

I wasn't sure so I started working on a solution.. I came back to see you had already marked an accepted answer which is great that must have been what you were looking for.

I don't expect or want you to mark this as the accepted answer but I had fun trying to find a solution, so here you go:

var dateCount = 0;
var addtoTr = 0;
var table = $("table:first");
var date = table.find('tr:first').find('td:first').html();

   table.find("tr").each(function(index) {
       if(date === $(this).find("td:first").html() || date === ''){
        dateCount++;
       }
       else{
          table.find('tr').eq(addtoTr).prepend('<td rowspan='+dateCount+'>'+date+'</td>');
          dateCount = 1;
          date = $(this).find("td:first").html();
          addtoTr = index;
       } 
       $(this).find("td:first").remove();
   });
   table.find('tr').eq(addtoTr).prepend('<td rowspan='+dateCount+'>'+date+'</td>');

http://jsfiddle.net/SULK3/6/

This is only one way to do it.. I'm sure there are many other, and better ways.

Upvotes: 1

adeneo
adeneo

Reputation: 318172

In this line

var table = $(this).closest("table");

what is this? In the fiddle, it's the window, which has no closest table, as closest() means closest parent element?

As there is only one table, are two tables, just changing it to

var table = $('table:first')

seems to work :

FIDDLE

Upvotes: 2

Related Questions