For loop variable indexing

Question

I am trying to invoke/call a variable that has already been declared. I am calling it in a for loop to do some basic console.log() iteration testing so that I know what I'm targeting and what is getting rendered. I do not want to have to write out the syntax for the selector again in the for loop (which is the genesis of this question).

Is there a way to call a variable within a for loop and append the iteration number to it as well.

Please consider the following code:

var $inputBoxes =  $('.rrSumColTotal').closest('table').find('tr td input[type=text]').not(':first');

        for (i = 0, z = $inputBoxes.length; i < z; i++){
            console.log($inputBoxes.attr("class").toString());
        }

I want each item iterated over to appear on a new line in the console, not all in one line like it currently does. For additional context, please consider this code, which does automatically place the iterated items on a new line.

for (i = 0, z = $("area[data-mkey]").length; i < z; i++) {
  var logThis = $("area[data-mkey]:eq('" + i + "')").attr("coords").split(",").splice(0, 4).toString();
  //console.log(logThis);
}

So, ideally I am looking for something like $inputBoxes[i] or $inputBoxes.index(i) but those do not work.

var $inputBoxes = $('.rrSumColTotal').closest('table').find('tr td input[type=text]').not(':first');
var $gridRows = $('.rrSumColTotal').closest('table').find('tr');

//Create an array of TD amount per row

$.each($inputBoxes, function(i) {
  $inputBoxes.addClass("targetInput_" + i);
});

//console.log($inputBoxes.length);
for (i = 0, z = $inputBoxes.length; i < z; i++) {
  console.log($inputBoxes.attr("class").toString());
}

<div class="rrQuestionContainer">
  <div></div>
  <span class="mrQuestionText" style=""><span class="sumcol"></span>Think about your LAST 10 CLL patients who were prescribed a 2nd line CLL treatment, are patients with 17p Deletion, and fit each bucket below. How many were treated with the following
  in the 2nd line? Responses must add up to at least 10 across all columns, but may add to more if combination therapy was used.</span>
  <div></div>
  <span style="">
								<table summary="<span class='sumcol'></span>Think about your LAST 10 CLL patients who were prescribed a 2nd line CLL treatment, are patients with 17p Deletion, and fit each bucket below. How many were treated with the following in the 2nd line?
  Responses must add up to at least 10 across all columns, but may add to more if combination therapy was used." class="mrQuestionTable" style="width: 925px;">
  <tbody>
    <tr>
      <td id="Cell.0.0">
      </td>
      <td id="Cell.1.0" class="mrGridQuestionText" style="width: 150px;">
        <div></div>
        <span class="mrQuestionText" style=""><center><b>2<sup>nd</sup> Line CLL Patients Who:</b> Has 17p Deletion, has NOT received Imbruvica (ibrutinib) or Zydelig (idelalisib) in the 1st line</center></span>
      </td>
      <td id="Cell.2.0" class="mrGridQuestionText" style="width: 150px;">
        <div></div>
        <span class="mrQuestionText" style=""><center><b>2<sup>nd</sup> Line CLL Patients Who:</b> Has 17p Deletion, has received Imbruvica (ibrutinib) in the 1st line, but NOT Zydelig (idelalisib) in the 1<sup>st</sup> line</center></span>
      </td>
      <td id="Cell.3.0" class="mrGridQuestionText" style="width: 150px;">
        <div></div>
        <span class="mrQuestionText" style=""><center><b>2<sup>nd</sup> Line CLL Patients Who:</b> Has 17p Deletion, has received Zydelig (idelalisib) in the 1st line, but NOT Imbruvica (ibrutinib) in the 1<sup>st</sup> line</center></span>
      </td>
      <td id="Cell.4.0" class="mrGridQuestionText" style="width: 150px;">
        <div></div>
        <span class="mrQuestionText" style=""><center><b>2<sup>nd</sup> Line CLL Patients Who:</b> Has 17p Deletion, has received Imbruvica (ibrutinib) AND Zydelig (idelalisib) in the 1<sup>st</sup> line</center></span>
      </td>

    </tr>
    <tr>
      <td id="Cell.0.1" class="mrGridCategoryText" style="text-Align: Left;vertical-align: Middle;background-color: #D8D8D8;width: 300px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <span class="mrQuestionText" style="font-size: 9pt;"><b>Antibody infusions</b>:<br> Rituxan (rituximab),<br>Gazyva (obinutuzumab), etc.</span>
      </td>
      <td id="Cell.1.1" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__01_QB1A" id="_Q0_Q0_Q0" class="mrEdit" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.2.1" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__01_QB1B" id="_Q0_Q0_Q1" class="mrEdit targetInput_0 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.3.1" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__01_QB1C" id="_Q0_Q0_Q2" class="mrEdit targetInput_1 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.4.1" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__01_QB1D" id="_Q0_Q0_Q3" class="mrEdit targetInput_2 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>

    </tr>
    <tr>
      <td id="Cell.0.2" class="mrGridCategoryText" style="text-Align: Left;vertical-align: Middle;background-color: #F8F8F8;width: 300px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <span class="mrQuestionText" style="font-size: 9pt;"><b>Chemo:</b> Fludara (fludarabine), Treanda (bendamustine), etc.</span>
      </td>
      <td id="Cell.1.2" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__02_QB1A" id="_Q0_Q1_Q0" class="mrEdit targetInput_3 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.2.2" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__02_QB1B" id="_Q0_Q1_Q1" class="mrEdit targetInput_4 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.3.2" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__02_QB1C" id="_Q0_Q1_Q2" class="mrEdit targetInput_5 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.4.2" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__02_QB1D" id="_Q0_Q1_Q3" class="mrEdit targetInput_6 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>

    </tr>
    <tr>
      <td id="Cell.0.3" class="mrGridCategoryText" style="text-Align: Left;vertical-align: Middle;background-color: #D8D8D8;width: 300px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <span class="mrQuestionText" style="font-size: 9pt;"><b>Antibody and Chemo</b> : "FCR" (fludarabine/ cyclophosphamide/ rituximab) or BR ((bendamustine and rituximab)</span>
      </td>
      <td id="Cell.1.3" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__03_QB1A" id="_Q0_Q2_Q0" class="mrEdit targetInput_7 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.2.3" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__03_QB1B" id="_Q0_Q2_Q1" class="mrEdit targetInput_8 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.3.3" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__03_QB1C" id="_Q0_Q2_Q2" class="mrEdit targetInput_9 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.4.3" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__03_QB1D" id="_Q0_Q2_Q3" class="mrEdit targetInput_10 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>

    </tr>
    <tr>
      <td id="Cell.0.4" class="mrGridCategoryText" style="text-Align: Left;vertical-align: Middle;background-color: #F8F8F8;width: 300px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <span class="mrQuestionText" style="font-size: 9pt;"><b>Oral Oncolytic</b>: Imbruvica</span>
      </td>
      <td id="Cell.1.4" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__04_QB1A" id="_Q0_Q3_Q0" class="mrEdit targetInput_11 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.2.4" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__04_QB1B" id="_Q0_Q3_Q1" class="mrEdit targetInput_12 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.3.4" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__04_QB1C" id="_Q0_Q3_Q2" class="mrEdit targetInput_13 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.4.4" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__04_QB1D" id="_Q0_Q3_Q3" class="mrEdit targetInput_14 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>

    </tr>
    <tr>
      <td id="Cell.0.5" class="mrGridCategoryText" style="text-Align: Left;vertical-align: Middle;background-color: #D8D8D8;width: 300px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <span class="mrQuestionText" style="font-size: 9pt;"><b>Oral Oncolytic</b>: Zydelig</span>
      </td>
      <td id="Cell.1.5" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__05_QB1A" id="_Q0_Q4_Q0" class="mrEdit targetInput_15 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.2.5" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__05_QB1B" id="_Q0_Q4_Q1" class="mrEdit targetInput_16 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.3.5" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__05_QB1C" id="_Q0_Q4_Q2" class="mrEdit targetInput_17 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.4.5" style="text-Align: Center;vertical-align: Middle;background-color: #D8D8D8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__05_QB1D" id="_Q0_Q4_Q3" class="mrEdit targetInput_18 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>

    </tr>
    <tr>
      <td id="Cell.0.6" class="mrGridCategoryText" style="text-Align: Left;vertical-align: Middle;background-color: #F8F8F8;width: 300px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <table style="vertical-align: middle; border-collapse: collapse; border: none;">
          <tbody>
            <tr>
              <td style="min-width: 60%; vertical-align: top;">

                Other(specify)
              </td>
              <td style="min-width: auto; vertical-align: top;" class="moved_GRB1_Other">
                <input type="text" name="_QPageB1_QB1__OS__1" id="_Q1" class="mrEdit targetInput_19 rowA" autocomplete="on" style="margin-left: 1em;width: 8em;" maxlength="1024" value="">
              </td>
            </tr>
          </tbody>
        </table>
      </td>
      <td id="Cell.1.6" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__Other_QB1A" id="_Q0_Q5_Q0" class="mrEdit targetInput_20 rowB rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.2.6" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__Other_QB1B" id="_Q0_Q5_Q1" class="mrEdit targetInput_21 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.3.6" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__Other_QB1C" id="_Q0_Q5_Q2" class="mrEdit targetInput_22 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>
      <td id="Cell.4.6" style="text-Align: Center;vertical-align: Middle;background-color: #F8F8F8;width: 120px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;">
        <div></div>
        <span style="">
												<div></div>
												<input type="text" name="_QPageB1_QGRB1_Q__Other_QB1D" id="_Q0_Q5_Q3" class="mrEdit targetInput_23 rowA" autocomplete="on" style="width: 3em;" maxlength="2" value="">
											</span>
      </td>

    </tr>
    <tr>
      <td id="Cell.0.6" class="mrGridCategoryText" style="text-Align: Left;vertical-align: Middle;background-color: #F8F8F8;width: 300px;border-color: black;border-width: 1px;border-left-style: Solid;border-right-style: Solid;border-top-style: Solid;border-bottom-style: Solid;"><span class="rrSumColTotal">0</span>
      </td>
      <td id="Cell.1.6" style="text-align: center; vertical-align: middle; width: 120px; border: 1px solid black; background-color: rgb(170, 204, 238);" rowspan=""><span id="spRunningTotal1" class="rrRunningTotal" data-columnordinal="1">0</span>
      </td>




    </tr>
  </tbody>
  </table>
  </span>
</div>

Encourage this guy for sharing the issue and fix that he fixed. — Rajaprabhu Aravindasamy
– Rajaprabhu Aravindasamy, Commented Apr 19, 2016 at 15:56
$("area[data-mkey]:eq('" + i + "')") what is the problem with that? — Tushar
– Tushar, Commented Apr 19, 2016 at 15:56

Alexander Dixon · Accepted Answer · 2016-04-19 16:03:06Z

1

The jQuery method to acheive the desired functionality within the console and dynamic one-to-one variable ratio access is .eq().

var $inputBoxes = $('.rrSumColTotal').closest('table').find('tr td input[type=text]').not(':first');
var $gridRows = $('.rrSumColTotal').closest('table').find('tr');

//Create an array of TD amount per row

$.each($inputBoxes, function (i) {
    $inputBoxes.eq(i).addClass("targetInput_" + i);
});

//console.log($inputBoxes.length);
for (i = 0, z = $inputBoxes.length; i < z; i++){
    console.log($inputBoxes.eq(i).attr("class").toString());
}

jQuery Documentation

Description: Reduce the set of matched elements to the one at the specified index.

edited Apr 19, 2016 at 16:03

answered Apr 19, 2016 at 15:52

Alexander Dixon

8761 gold badge9 silver badges25 bronze badges

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

Collectives™ on Stack Overflow

For loop variable indexing

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related