Gareth Johnson
Gareth Johnson

Reputation: 113

Foreach loop for table in C# / jQuery

I have a table that is generated like so:

<div class="row">
<div class="col-md-12">
    <div id="calendar"></div>
    <table id="report" class="table">
        <thead>
            <tr>
                <th>Event</th>
                <th>Start Date</th>
                <th>End Date</th>
                <th>Status</th>
            </tr>
        </thead>
        <tbody />
    </table>
</div>

and populated using javascript:

var tableDetails = [
    data.title,
    $.fullCalendar.formatDate(startDate, "dd MMMM yyyy"),
    $.fullCalendar.formatDate(endDate, "dd MMMM yyyy"),
    data.published ? "Published" : "Not Published"
];

var row = $("<tr></tr>");

for (var i = 0; i < tableDetails.length; i++) {
    row.append($("<td></td>").text(tableDetails[i]));
}

$("table#report > tbody:last").append(row);

Is there a way of doing a foreach loop through the rows of the table so that I can get a List of all the Events to pass to a controller? Getting a list/array of strings would suffice, as I can simply add EventIds to the table which will uniquely identify the event.

Upvotes: 0

Views: 1730

Answers (3)

Reinstate Monica Cellio
Reinstate Monica Cellio

Reputation: 26143

The simplest form would be this...

$("#report tbody tr").each(function() {
    // do something here with $(this) which is the row 
});

Upvotes: 1

azz
azz

Reputation: 5930

Is there a way of doing a foreach loop through the rows of the table, so that I can get a List of all the Events to pass to a controller?

If all you need is an array of a certain property (say, the name of the event) of each object, this will do that for you. If not, the other answers provided are the correct way of iterating through each row/cell.

var list = $('#report > tbody > tr').map(function () {
    return $(this).find('td:eq(0)').text();
}).get();

Say you have three events, it will return

list == ["event 1 name", "event 2 name", "event 3 name"];

Of course you can modify the return line above to whichever property you like, e.g. $(this).attr('id')

Upvotes: 1

Nunners
Nunners

Reputation: 3047

Simple jQuery to itterate over each row and cell : (Does not include TH Cells)

    $('#report tr').each(function() {
        //do something to row...
        $(this).find('td').each(function() {
            //do something to cell...
        });
    });

Upvotes: 1

Related Questions