Create Multidimensional Array From Table Text

Question

I am attempting to place text from a <table> into a an array, as an array of text.

Sample HTML:

<table class="sort">
    <caption>Census Data</caption>
    <tr>
        <th class="alpha">First Name:</th>
        <th class="alpha">Last Name:</th>
        <th class="date">Date of Birth:</th>
        <th class="numeric">Age:</th>
        <th class="alpha">Gender:</th>
    </tr>
    <tr>
        <td>Peter</td>
        <td>Parker</td>
        <td>12/23/1975</td>
        <td>36</td>
        <td>Male</td>
    </tr>
    <tr>
        <td>John</td>
        <td>Doe</td>
        <td>06/09/1982</td>
        <td>30</td>
        <td>Male</td>
    </tr>
</table>

Ultimate goal it to have an array like this:

var array = [
             ["Peter", "Parker", "12/23/1975", "36", "male"], 
             ["John", "Doe", "06/09/1982", "30", "male"]
            ];

This is what I currently have, my problem seems to be with me inner return not actually being an array when it reaches the outer map. When I alert(innerArray.toString()); it gives me the comma separated string as if it is a string inside, but on the outside it seems to join the arrays into one rather than make it multidimensional.

var outerArray = $(".sort tr").not(":first-child").map(function(){
    var innerArray = $(this).children().map(function(){
       return $(this).text();
    }).toArray();           
    return innerArray;
}).toArray();

jbabey · Accepted Answer · 2013-02-28 17:29:48Z

2

There's probably some fancy way to do it with map, but I prefer just looping via each as it is easier to understand and maintain.

var resultArray = [];

$(".sort tr").not(":first-child").each(function () {
    var innerArray = [];

    $(this).find('td').each(function () {
        innerArray.push($(this).text());
    });

    resultArray.push(innerArray);
});

Working example.

answered Feb 28, 2013 at 17:29

jbabey

46.7k12 gold badges73 silver badges94 bronze badges

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

1 Comment

Iron3eagle Over a year ago

Fancy or not it works good sir! Thank you kindly! Think I got my head too wrapped around the .map() and .toArray() functions that I missed the obvious :)

Cyril ALFARO · Accepted Answer · 2013-02-28 17:14:17Z

0

try this :

var outerArray = new Array() ;

$('.sort').children('tr').each(function(i,elem) {
     outerArray.push(elem.children('td')) ;
});

answered Feb 28, 2013 at 17:14

Cyril ALFARO

1,6811 gold badge18 silver badges35 bronze badges

1 Comment

Iron3eagle Over a year ago

I fixed some of the code errors in your answer to make it work, but it just places the jQuery Object of the element <td> into the array. I need to be able to reference that data as a multidimensional array like: var data = outerArray[0][2]; Having it in element Object form doesn't really help.

Collectives™ on Stack Overflow

Create Multidimensional Array From Table Text

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related