Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Looping through elements

I have a page with the following code. Only rows two and three shown.

<tr>
<td data-field="Region" class="ewTableAltRow">
<span data-class="tpx2_2_rptVispTrainingLossV2_Region">East</span>
</td>
<td data-field="AreaShort" class="ewTableAltRow">
<span data-class="tpx2_2_rptVispTrainingLossV2_AreaShort">EastWay</span>
</td>
<td data-field="FSM" class="ewTableAltRow">
<span data-class="tpx2_2_rptVispTrainingLossV2_FSM">Tom Smith</span>
</td>
<td data-field="ProdCode" class="ewTableAltRow" style="text-align:center;">
<span data-class="tpx2_2_rptVispTrainingLossV2_ProdCode">Door45</span>
</td>
<td data-field="Item" class="ewTableAltRow">
<span data-class="tpx2_2_rptVispTrainingLossV2_Item">A123 Training</span>
</td>
<td data-field="Course" class="ewTableAltRow" style="text-align:center;">
<span data-class="tpx2_2_rptVispTrainingLossV2_Course">A123</span>
</td>
</tr>

<tr>
<td data-field="Region" class="ewTableRow">
<span data-class="tpx3_3_rptVispTrainingLossV2_Region">East</span>
</td>
<td data-field="AreaShort" class="ewTableRow">
<span data-class="tpx3_3_rptVispTrainingLossV2_AreaShort">Norwalk</span>
</td>
<td data-field="FSM" class="ewTableRow">
<span data-class="tpx3_3_rptVispTrainingLossV2_FSM">Bob Jones</span>
</td>
<td data-field="ProdCode" class="ewTableRow" style="text-align:center;">
<span data-class="tpx3_3_rptVispTrainingLossV2_ProdCode">Door46</span>
</td>
<td data-field="Item" class="ewTableRow">
<span data-class="tpx3_3_rptVispTrainingLossV2_Item">A456 Training</span>
</td>
<td data-field="Course" class="ewTableRow" style="text-align:center;">
<span data-class="tpx3_3_rptVispTrainingLossV2_Course">A456</span>
</td>
</tr>

How do I loop through this to get the span element in the Course column and pass the value to my ajax?
The values would be A123 in row two and A456 in row three.
I know how to write the ajax part but not the .each function to get that specific item.

Scott

Comments

  • with jQuery it's just css, so any of these will work:

    $('td[data-field="Course"] span').each(function(i, element) { });
    $('td:last-child span').each(function(i, element) { });

    you probably want to make these more specific by adding a table id, unless you want this for every table.

    $('#id_of_table_element td[data-field="Course"] span').each(function(i, element) { });

  • Thanks, That helped. One other question. What would I have to modify if I also needed to pull the FSM(eg Bob Jones) so the ajax would have two variables in the GET?

  • Look into the jQuery docs on traversing the DOM and see if you can figure out how to get to that element, best way to learn.

    https://api.jquery.com/category/traversing/

Sign In or Register to comment.