user7293417
user7293417

Reputation: 107

Looping through a specific group of text box

Hi I have seen basics of looping however, when looping through specific checkboxes, what would I add within the jquery code besides the basic loop function below? Like what can I use to loop through a group of checkboxes specially. thank you. I added the HTML format of checkboxes below.

$( "A" ).each(function( index ) { console.log( index + ": " + $( this ).text() ); });

<td  class="dot_wrap">
            <label for="A1"><span class="hidden">A-1</span>
                <input type="checkbox" value="A1" name="A1" id="A1" tabindex="1" class="A"> 
                <span aria-hidden="true">&nbsp;</span>
            </label>
        </td>

        <td class="dot_wrap">
            <label for="A4"><span class="hidden">A-4</span>
               <input type="checkbox" value="A4" name="A4" id="A4" tabindex="4" class="A">
               <span aria-hidden="true">&nbsp;</span>
           </label>
        </td>

        <td class="dot_wrap">
          <label for="A2"><span class="hidden">A-2</span>
              <input type="checkbox" value="A2" name="A2" id="A2" tabindex="2" class="A">
              <span aria-hidden="true">&nbsp;</span>
          </label>
        </td>

        <td class="dot_wrap">
          <label for="A5"><span class="hidden">A-5</span>
              <input type="checkbox" value="A5" name="A5" id="A5" tabindex="5" class="A">
              <span aria-hidden="true">&nbsp;</span>
          </label>
        </td>

    <td class="dot_wrap">
        <label for="A3"><span class="hidden">A-3</span>
            <input type="checkbox" value="A3" name="A3" id="A3" tabindex="3" class="A">
            <span aria-hidden="true">&nbsp;</span>
        </label>
    </td>

    <td class="dot_wrap">
        <label for="A6"><span class="hidden">A-6</span>
            <input type="checkbox" value="A6" name="A6" id="A6" tabindex="6" class="A">
            <span aria-hidden="true">&nbsp;</span>
         </label>
   </td>

Upvotes: 0

Views: 38

Answers (1)

Svish
Svish

Reputation: 158111

Using a regular CSS selector works:

$('input[type=checkbox]')

jQuery also has a special :checkbox selector for this:

$('input:checkbox')

If you want to narrow it down to the ones with your class A, you can just add that in the selector:

$('input.A[type=checkbox]')
$('input.A:checkbox')

Or if you have them all gathered under a node (a form with an id for example), you can also narrow it down using the second parameter of the selector function:

$('input:checkbox', '#my-form')

And with a class selector as well:

$('input.A:checkbox', '#my-form')

Upvotes: 1

Related Questions