CODEWITHSUNDEEP
jqueryarrays
Vikram Anand Bhushan
Vikram Anand Bhushan

Reputation: 4886

How to get the values of a column from a table in jQuery into a multidimentional array

I have a table that is something like this 

<table width="60%">
    <tbody>
        <tr>
            <th>Corredor Feed</th>
            <th>Nombre</th>
            <th>Empressa</th>
            <th>Pagina Web</th>
            <th>Telefono</th>
            <th>Cellular</th>
        </tr>
       <tr class="row">
            <td>[email protected]
                <input type="hidden" value="[email protected]" name="email[]"/>
            </td>
            <td>
                <input type="input" value="" class="validate" name="nombre[]"/>
            </td>
            <td>
                <input type="input" value="" name="empressa[]"/>
            </td>
            <td>
                <input type="input" value="" name="paginaWeb[]"/>
            </td>
            <td>
                <input type="input" value="" name="telefono[]"/>
            </td>
            <td>
                <input type="input" value="" name="cellular[]"/>
            </td>
        </tr>
        <tr>
            <td align="right" colspan="6">
                <input type="submit" value="Enviar" name="submitme"/>
            </td>
        </tr>
    </tbody>
</table>

I am trying to create a multi dimensional array from the values obtained from each row in jQuery I have thought of a script like this 

$('.row').each(function (i) {
                    $(this).find('td').each(function (j) {
                        /*if (j == 5) {
                            var x = $(this).find("input").val();
                            feed.push({
                                cellular: x
                            });
                        }*/
              //here I have to create an array that will hold value of each row 


                    });

                });
});

But I do not know how to push the values from the input type of each row into a multi dimensional array

JSFIDDLE Thanks in Advance

Upvotes: 0

Views: 212

Answers (2)

Ciccolina
Ciccolina

Reputation: 514

Create a new array and object, loop through rows's content. Inside each row, retrieve input's name and value attributes. Add them to object and then .push() that object into rows array.

var rows = [];
$('.row').each(function (i) {
    var content = {};
    $(this).find('td').each(function (j, v) {
        var input = $("input", this),
            name = input.attr("name").substring(0, input.attr("name").length - 2),
            value = input.val();
        content[name] = value;
    });
    rows.push(content);
});

Here is a working example.

Upvotes: 2

Fenistil
Fenistil

Reputation: 3801

<table width="60%">
    <tbody>
        <tr>
            <th>Corredor Feed</th>
            <th>Nombre</th>
            <th>Empressa</th>
            <th>Pagina Web</th>
            <th>Telefono</th>
            <th>Cellular</th>
        </tr>
        <tr class="row">
            <td>[email protected]
                <input type="hidden" value="[email protected]" name="email[]" />
            </td>
            <td>
                <input type="input" value="1" class="validate" name="nombre[]" />
            </td>
            <td>
                <input type="input" value="2" name="empressa[]" />
            </td>
            <td>
                <input type="input" value="3" name="paginaWeb[]" />
            </td>
            <td>
                <input type="input" value="4" name="telefono[]" />
            </td>
            <td>
                <input type="input" value="5" name="cellular[]" />
            </td>
        </tr>
        <tr class="row">
            <td>[email protected]
                <input type="hidden" value="[email protected]" name="email[]" />
            </td>
            <td>
                <input type="input" value="2-1" class="validate" name="nombre[]" />
            </td>
            <td>
                <input type="input" value="2-2" name="empressa[]" />
            </td>
            <td>
                <input type="input" value="2-3" name="paginaWeb[]" />
            </td>
            <td>
                <input type="input" value="2-4" name="telefono[]" />
            </td>
            <td>
                <input type="input" value="2-5" name="cellular[]" />
            </td>
        </tr>
        <tr>
            <td align="right" colspan="6">
                <input type="submit" value="Enviar" name="submitme" />
            </td>
        </tr>
    </tbody>
</table>

<script>
var rows = new Array();
var row = new Array();

$('.row').each(function (i) {
    row = [];
    $(this).find('td').each(function (j) {
        row.push($(this).find("input").val());
    });
    rows.push(row);
});
alert(JSON.stringify(rows));
</script>

Upvotes: 1

Related Questions