Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery only affects the last result in a while loop: MySQL
    primarykey
    data
    text
    <p>I am trying to make the background color change for each checked item in a row in a while loop. Currently the jQuery only works on the last row. I did put an <code>$i</code> variable in the input id, but to be honest, I'm not sure what to do beyond it. I tried <a href="http://eligeske.com/jquery/while-loop-with-jquery/" rel="nofollow">this</a>, the <code>.each</code> function, and a bunch of answers on Stack Overflow, but I can't figure out how to take care of this.</p> <p>Here is the jQuery:</p> <pre><code>$(document).ready(function(){ $('#org[$i]').change(function(){ if(this.checked){ $(this).siblings('table').removeClass('unchecked'); $(this).siblings('table').addClass('checked'); $(this).parentsUntil('td').removeClass('unchecked'); $(this).parentsUntil('td').addClass('checked'); } else { $(this).siblings('table').removeClass('checked'); $(this).siblings('table').addClass('unchecked'); $(this).parentsUntil('td').removeClass('checked'); $(this).parentsUntil('td').addClass('unchecked'); } }); }); </code></pre> <p>Here is the loop (with some unimportant stuff cut out). <code>$i</code> iterates properly in each <code>#org</code> (I checked in Firebug):</p> <pre><code>if ($i % 4 == 0) echo ($i &gt; 0? '&lt;/tr&gt;' : '') . '&lt;tr&gt;'; echo "&lt;td class=\"unchecked\"&gt; &lt;div class=\"unchecked\"&gt; &lt;input id=\"org[".$i."]\" style=\"float:right\" type=\"checkbox\" name=\"org\" value=\"".$row['i_id']."\"/&gt; &lt;table class=\"unchecked\"&gt; //blah, blah, blah &lt;/table&gt; &lt;/div&gt; &lt;/td&gt;'; if ($i == $countRows - 1) echo '&lt;/tr&gt;'; $i++; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload