Using a ForEach iteration to loop through a table in C# and jQuery

Question

Using a ForEach iteration to loop through a table in C# and jQuery

My generated table structure is as follows:

<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>

The table content is dynamically populated via 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);

I am exploring methods to iterate through the table rows using a foreach loop in order to retrieve a list of all Events for passing to a controller. A list/array of strings would suffice, as EventIds can be added to uniquely identify each event within the table.

c#jquery

Answer 1

Answer №1

Here is a concise version...

$(".table-data tbody tr").each(function() {
    // perform a task with $(this) representing the current row
});

Answer 2

Here is a concise version...

$(".table-data tbody tr").each(function() {
    // perform a task with $(this) representing the current row
});

Answer 3

Answer №2

Easy jQuery code to loop through each row and cell : (Excludes TH Cells)

    $('#report tr').each(function() {
        //perform action on row...
        $(this).find('td').each(function() {
            //perform action on cell...
        });
    });

Answer 4

Easy jQuery code to loop through each row and cell : (Excludes TH Cells)

    $('#report tr').each(function() {
        //perform action on row...
        $(this).find('td').each(function() {
            //perform action on cell...
        });
    });

Answer 5

Answer №3

Is there a way to utilize a foreach loop to iterate through the rows of a table, in order to create a List containing all the Events that can then be passed to a controller?

If your requirement is simply an array of a specific property (such as the event name) from each object, this code snippet will fulfill that need. Otherwise, the alternative answers shared here demonstrate the proper manner of iterating through each row and cell.

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

For instance, if you have three events, it will result in

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

Naturally, you have the flexibility to adjust the return statement above according to the property of interest, such as $(this).attr('id')

Answer 6

Is there a way to utilize a foreach loop to iterate through the rows of a table, in order to create a List containing all the Events that can then be passed to a controller?

If your requirement is simply an array of a specific property (such as the event name) from each object, this code snippet will fulfill that need. Otherwise, the alternative answers shared here demonstrate the proper manner of iterating through each row and cell.

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

For instance, if you have three events, it will result in

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

Naturally, you have the flexibility to adjust the return statement above according to the property of interest, such as $(this).attr('id')

Using a ForEach iteration to loop through a table in C# and jQuery

Answer №1

Answer №2

Answer №3

Similar questions

Troubleshooting issue with parsing MySQL data in HTML table using Node.js

The Jquery function appears to be malfunctioning, however, no errors are being reported

Is there a way to use jQuery to automatically scroll to the most recent ID on a

What is the process for making an Ajax request in Rails?

After two HTML injections, Javascript ceases to function properly

A guide on converting JSON to FHIR using C#

Center an absolutely positioned div using CSS

Switching visual representation that appears upon clicking the dropdown menu

How to dynamically insert elements into the HTML page using Angular

Tips for handling attributes of an HTML element when the HTML content is stored within a variable

Removing the gap between the clicked point and the draw point in Html5 canvas

Once it hits the fourth tab, it must not cycle back to the first one

Utilize the ForEach method on an object obtained through a jQuery ajax request

Tips for adding a form input field into a table structure

Navigating links with Jinja using jQuery and AJAX

Building an expandable vertical dropdown with Bootstrap that opens with a click

What is the best way to choose the ul list item option using Selenium and C#?

Encountering an issue with jQuery ajax when attempting to make a post

Prevent sound from continuing to play when a different DIV is selected

In what ways can I enhance and visually improve JSON data using a jquery/javascript plugin?