0

I've retrieved values from a table, originating from a single column, that I end up storing in an array; but all the data is stored in a single index, and I haven't succeeded in splitting the array with .split.

Step 1 -- I target body and tr.

var stuff = document.getElementById('pricetable').querySelectorAll('tbody tr');

Step 2 -- I initiate a for-loop:

for (var i = 0; i < rows.length-1; i++) {
        var rows2 = Array.prototype.slice.call(stuff)[i].querySelectorAll('td')[3];}

rows2 will now print a string that looks like this:

<td>​2400​</td>​ 
<td>​1900​</td>​
<td>​9790​</td>​
<td>​1098​</td>​
<td>​1289​</td>​
<td>​3284​</td>​

I think my problem starts here, since I don't know how to make it into an array and have each of these values stored its own index.

Step 3 -- To retrieve only the text, I create a new variable:

var my_list = rows2.textContent;

Step 4 -- I then attempt to split the array:

var price_list = my_list.split(','));

Although price_list is an array (I verified), all values remain in price_list[0]. It prints like this:

["2400"]
["1900"]
["9790"]
["1098"]
["1289"]
["3284"]

If split won't do the trick in this case, do I need to loop through those values? If so, how? Or should I have taken a different course of action? The research that I've done explains how split works with predefined strings that aren't retrieved from the DOM.

Community
  • 1
  • 1
Dan Sebastian
  • 519
  • 5
  • 19
  • `rows2` is not an array, but a single row. `my_list` is not an array, but a string (that's why you can `.split()` it at all). What you have is a loop over multiple `my_list` strings. Put them in an array using `push`, and then use that after your loop. – Bergi May 13 '15 at 02:49
  • Btw, instead of using `querySelectorAll` you could just have use `.rows[i].cells[3].textContent` – Bergi May 13 '15 at 02:50

1 Answers1

2

First, this is completely unnecessary...

var rows2 = Array.prototype.slice.call(stuff)[i].querySelectorAll('td')[3];

Also, your variable naming is weird. Why are you calling it rows2 when you're getting the 4th cell?

To get the fourth cell, just do this:

var cell4 = stuff[i].cells[3];

But if you want an array of those values, then do this instead.

var list = Array.prototype.map.call(stuff, function(row) {
    return row.cells[3].textContent;
});

This borrows the .map() function from Array.prototype, which gives you a new array of whatever values you returned from the callback.

If this isn't what you want, then you need to describe specifically what it is you're after instead of just showing code that doesn't do what you want.

  • I was testing a lot and wasn't attentive to variable semantics. Yes, your cell4 variable is better; the list variable, however, gives me an error: "TypeError: undefined is not an object (evaluating 'row.cells[3].textContent')" -- if I remove textContent, the error goes away. Any solutions to that? Also, by using the loop, I can exclude the last row by "i < rows.length-1"; not sure if I can do it in the list variable. – Dan Sebastian May 13 '15 at 03:27
  • 1
    Do your rows have 4 `` elements each? To exclude the last row, change it to `var list = Array.prototype.slice.call(stuff, 0, -1).map(function(row) {...` –  May 13 '15 at 03:38
  • Wonderful, that did it! I think you forgot to include slice after prototype, that's why I was receiving the error. When I tried your second suggestion, it worked! Thanks for pointing out how to exclude the last row. – Dan Sebastian May 13 '15 at 03:51
  • 1
    @DanSebastian: `.slice()` is only needed in this case if you want to reduce the set. It works fine with `Array.prototype.map` if you want to include all the rows. There must have been some other issue. Anyway, glad it's working. –  May 13 '15 at 04:10