Loop through the table and save a specific cell in the array, if the row is checked

Question

I currently have a table that runs on a drop down list. There is a flag inside the table. When the checkbox is selected and the user presses the confirmation button, the code must go through the table and receive the email values ​​of all the marked lines and save them in an array. So far, he could check if the lines are checked. I found several ways on the Internet, but did not work. Here is the table:

    <?php if ($picked != null){ ;
      foreach ($picked as $rows): ?> 
        echo base_url(); ?>employer/view/send/<?php echo $rows['username']; ?>-->
      <!--form action="" method="POST"--> 
      <?php endforeach; ?>
      <table id="view_add" 
        class="table dataTable table-striped table-dynamic table-hover _tm">
        <thead>
          <tr>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1"
              style="width: 250px;">
              Applicant Name
            </th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1"
              style="width: 200px;">
              Employer
            </th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1"
              style="width: 200px;">
              Post Header
            </th>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1"
              style="width: 450px;">
              Description
            </th>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1"
              style="width: 100px;">
              VIEW CV
            </th>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1" 
              style="width: 100px;">
            </th>
          </tr>
        </thead>
        <tbody>
          <?php foreach ($picked as $rows): ?> 
          <tr>
            <td><?php echo $rows['applicantName']; ?></td>
            <td><?php echo $rows['employerName']; ?></td>
            <td><?php echo $rows['postingName']; ?></td>
            <td><?php echo $rows['postDescription']; ?></td>
            <td style="display: none;"><?php echo $rows['email']; ?></td>
            <td><a id="stress" data-toggle="modal" href="#editButton" 
              data-full="<?php echo $rows['fullName']; ?>" 
              data-school="<?php echo $rows['institution']; ?>" 
              data-state="<?php echo $rows['state']; ?>" 
              data-location="<?php echo $rows['location']; ?>" 
              data-dob="<?php echo $rows['dob']; ?>" data-skill="<?php echo $rows['skills']; ?>" 
              data-sex="<?php echo $rows['sex']; ?>" data-gpa="<?php echo $rows['cgpa']; ?>" 
              data-call="<?php echo $rows['phone']; ?>" 
              data-like="<?php echo $rows['favoured']; ?>" 
              data-award="<?php echo $rows['awards']; ?>" 
              data-interest="<?php echo $rows['interests']; ?>" class="myeditButton"
            >view</a></td>
            <td>
              <label class="switch m-r-40">
                <input type="checkbox" class="switch-input" 
                  id="<?php echo $rows['applicationKey']?>" 
                  data-mail="<?php echo $rows['email']; ?>" 
                  data-confirm="<?php echo $rows['applicationId']; ?>" 
                  id="check" name="check" <?php echo $rows['status'] ? 'checked':''; ?> >
                <span class="switch-label" data-on="yes" data-off="no"></span>
                <span class="switch-handle"></span>
              </label>
            </td>
          </tr>
          <?php endforeach; ?>
        </tbody>
      </table>
      <div class="form-group">
        <input type="submit" value="Confirm" id="mail" class="btn btn-primary mail">
      </div>
    <!--/form-->
 <?php }else{ ;?>
   <div class="alert alert-warning">
     <h4>There are no current Applicants for this post.</h4>
   </div>'
   <?php } ;?>

Here is the little script I used:

    <script>
$(document).on("click", "#mail", function () //<-small mistake here
{
   var mail_list = [];
   $( 'input[type=checkbox]:checked' ).each(
        function(){
            var mail = $(this).data("mail");

            mail_list.push(mail);

            var emailers = mail_list.join(",");

//SEND TO PHP
           $.ajax({
           type: 'post',
           url: '<?php echo base_url(); ?>employer/view/send',
           data: {
                     chosen: emailers
                    },
           success: function( data ) {
                     console.log( data );
                    }
           }); 
            //the END
        }
    )
});
</script>

My JS is not so good.

Finally, heres php end

else if ($param1 == 'send') 
        {

        $src1= $_POST['chosen'];
        $array = explode(",", $src1);

        print_r($array);

Answer 1

-, "" . html - :

<td style="display: none;" class="email-value">
    <?php echo $rows['email']; ?>
</td>

, , html id # class .. :

$(document).on("click", "#mail", function () //<-small mistake here
{
   var mail_list = [];
   $( 'input[type=checkbox]:checked' ).each(
        function(){
            var mail = $(this).parents("tr").find(".email-value").text();
            //this line search the "tr" parent of each input checkbox that checked, 
            //and then finds the child "email" value of it.
            mail_list.push(mail);
        }
    )
})

---

<input type="checkbox" class="switch-input" 
              id="<?php echo $rows['applicationKey']?>" 
              data-mail="<?php echo $rows['email']; ?>" 
              data-confirm="<?php echo $rows['applicationId']; ?>" 
              data-email="<?= $rows['email']"
              id="check" name="check" <?php echo $rows['status'] ? 'checked':''; ?> >

javascript :

$(document).on("click", "#mail", function () //<-small mistake here
{
   var mail_list = [];
   $( 'input[type=checkbox]:checked' ).each(
        function(){
            var mail = $(this).data("email");

            mail_list.push(mail);
            //the END
        }
    )
})

update: oops, it parents *, parent ...

update2: ,

Answer 2

<script type="text/javascript">
$(document).on("click", ".mail", function ()
{
    var emailList = [];
    var selectedRows = $( 'table._tm' ).find( 'tbody' ) // select table body and
        .find( 'tr' ) // select all rows that has
        .has( 'input[type=checkbox]:checked' ) // checked checkbox element

          selectedRows.each(function(idx, elem) {
              var email = jQuery(elem).find('input[type="checkbox"]').data("mail");
               emailList.push(email);
          });
          console.log( 'elem:', emailList );
} );

Answer 3

It should be pretty simple to try something like this:

var emailList = [];

selectedRows.forEach(function(idx, elem) {
    var email = jQuery(elem).data("mail");
    emailList.push(email);
});